Loading source
Pulling the file list, source metadata, and syntax-aware rendering for this listing.
Source from repo
Build performant React Native and Expo apps with best practices for lists, animations, and navigation
Files
Skill
Size
Entrypoint
Format
Open file
Syntax-highlighted preview of this file as included in the skill package.
rules/rendering-text-in-text-component.md
1---2title: Wrap Strings in Text Components3impact: CRITICAL4impactDescription: prevents runtime crash5tags: rendering, text, core6---78## Wrap Strings in Text Components910Strings must be rendered inside `<Text>`. React Native crashes if a string is a11direct child of `<View>`.1213**Incorrect (crashes):**1415```tsx16import { View } from 'react-native'1718function Greeting({ name }: { name: string }) {19return <View>Hello, {name}!</View>20}21// Error: Text strings must be rendered within a <Text> component.22```2324**Correct:**2526```tsx27import { View, Text } from 'react-native'2829function Greeting({ name }: { name: string }) {30return (31<View>32<Text>Hello, {name}!</Text>33</View>34)35}36```37