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

How to pass props to StyleSheet in React Native using TypeScript?

$
0
0

I wanna create a custom button component that can pass props to the StyleSheet. At this project, the props I wanna send is the hexcode so the component can have different colors based on the color props that are passed to the component. So, I have written this

type Props = {  backgroundColor: string;  borderColor: string;};export const CustomButton = ({  backgroundColor,  borderColor,}: Props) => {  return (<TouchableOpacity      style={styles({ backgroundColor, borderColor }).container}></TouchableOpacity>  );const styles = ({ backgroundColor, borderColor }: Props) =>  StyleSheet.create({    container: {      backgroundColor: backgroundColor,      borderColor: borderColor,    },  });

The idea is to pass the props to the component, and then pass it to the styles on the Touchable component. But, this doesn't work. This always gives me this error on styles({ backgroundColor, borderColor}).container

Argument of type "{ backgroundColor, borderColor }" is not assignable to parameter of type "Props".

So, what went wrong? How am I supposed to pass the props to the StyleSheet?


Viewing all articles
Browse latest Browse all 6287

Trending Articles



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