Invariant Violation: Text strings must be rendered within a Text component Invariant Violation: Text strings must be rendered within a Text component reactjs reactjs

Invariant Violation: Text strings must be rendered within a Text component


You have a semicolon concatenated right after your children in CardSection component. This semicolon is interpreted as text and since every text must be within a <Text> component, the error is thrown.

To fix the issue, simply change

const CardSection = (props) => (  <View style={styles.containerStyle}>    {props.children};  </View>);

to

const CardSection = (props) => (  <View style={styles.containerStyle}>    {props.children}  </View>);


Try removing all whitespaces (and possibly line endings) from inside your parent tag.

Facebook says it's not a bug and working as intended(in a related bug report) and that they haven't introduced any changes into .56, but that's not how it actually works and it is working apparently differently from previous versions.

Also Expo has no problem with extra whitespaces there. How you're supposed to intend it now I can't tell you.