Passing Styles Based On Parent Component In React Native
Solution 1:
You aren't delegating the styles you pass to TextFile to the actual Text element in TextFile. What you can do is add the styles together by passing an array of style objects to apply it:
<Text style={[styles.text, props.style]}>
This is a line of text and this might be a second line
</Text>
From the React Native documentation:
You can also pass an array of styles - the last style in the array has precedence, so you can use this to inherit styles.
Thus, if you pass textAlign in textWithContainer, it'll be applied in the Text component, and it can be reused as you wish withouttextAlign.
Solution 2:
In my initial TextFile, I passed style as an argument, and in the styles array, just used style as the second item in the array.
constTextFile = ({ text, style }) => (
<Textstyle=([styles.text,style])> {text} </Text>
);
Whenever TextFile gets used, it will apply any styles being given within that component, and/or default to the initial styles it's being given in styles.text.
Thank you @Li357!
Post a Comment for "Passing Styles Based On Parent Component In React Native"