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

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 6214

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>