Sometimes, we want to add text like an HTML span with React Native.
In this article, we’ll look at how to add text like an HTML span with React Native.
How to add text like an HTML span with React Native?
To add text like an HTML span with React Native, we can nest Text
components.
For instance, we write:
import * as React from 'react';
import { Text, View } from 'react-native';
import Constants from 'expo-constants';
import { Card } from 'react-native-paper';
export default function App() {
return (
<View>
<Text>
<Text>foo</Text>
<Text>bar</Text>
</Text>
</View>
);
}
to add 2 Text
components beside each other in an outer Text
component.
Therefore, we see ‘foobar’ on the screen since they’re displayed inline.
Conclusion
To add text like an HTML span with React Native, we can nest Text
components.