I have a text re-usable component coded like this :
import React, {FC, ReactNode} from 'react';
import {StyleSheet, Text as RNText} from 'react-native';
interface TextProps {
style?: any;
children: ReactNode | ReactNode[];
}
const Text: FC<TextProps> = ({style, children}) => {
return <RNText style={{...styles.text, ...style}}>{children}</RNText>;
};
export default Text;
const styles = StyleSheet.create({
text: {
color: colors.black,
fontFamily: fonts.light,
},
});
So every time I want to style it I don't get any prop suggestions for styling a react native text component :
How can I get all react native styles props suggestions for a custom re-usable made component with typescript ?
CodePudding user response:
you should use StyleProp, look at the code below:
import {
ActivityIndicator,
StyleProp,
StyleSheet,
View,
ViewStyle,
TextStyle
} from 'react-native';
interface LazyLoadImageType {
imgUri: string;
onl oadEnd?: () => void;
style?: StyleProp<TextStyle>;
// or
style?: StyleProp<ViewStyle>;
// or
style?: StyleProp<ViewStyle | TextStyle>;
}