Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6580

How to fix a TypeScript false positive warning for "No overload matches this call."?

$
0
0

I have a React Native component that will render an Animated.View with an animated style for Android, otherwise it renders a View without this style.

My code is:

interface ButtonProps {  containerStyle?: StyleProp<ViewStyle>;}const Button: React.FC<ButtonProps> = ({ containerStyle }) => {  let ContainerView: typeof View | typeof Animated.View = View;  let viewShadow: AnimatedViewStyle | null = null;  if (Platform.OS === 'android') {    ContainerView = Animated.View;    // pressedAnim is an `Animated.Value` that I omitted from the code so it is simpler to read    viewShadow = {      elevation: pressedAnim.interpolate({        inputRange: [0, 1],        outputRange: [2, 8]      })    };  }  return {<ContainerView style={[styles.container, containerStyle, viewShadow]} />  }}const styles = StyleSheet.create({  container: { /* some style */ }});

The TypeScript warning No overload matches this call. is cause by the viewShadow. If I remove it from the style prop, the warning is dismissed. If I use only an Animated.View and keep the viewShadow, the warning is dismissed too.

So, the problem here is that the Animated.View and viewShadow are only used together, so this is a false-positive warning.

How can I fix this? Is there another way to write this code so TypeScript won't warn that something is wrong?


Viewing all articles
Browse latest Browse all 6580

Latest Images

Trending Articles



Latest Images