I have a native react app. And I have this simple objects:
export const AnimalGroupScreen = () => (
<SafeAreaView style={styles.container}>
<View style={styles.search}>
<Searchbar />
</View>
<View style={styles.list}>
<AnimalGroupInfo />
</View>
</SafeAreaView>
);
import React from "react";
import { Text } from "react-native";
export const AnimalGroupInfo = () => <Text> Hello there</Text>;
and app:
import { AnimalGroupScreen } from "./src/features/animalGroup/screens/animal-group-screen";
/* eslint-disable prettier/prettier */
import ExpoStatusBar from "expo-status-bar/build/ExpoStatusBar";
import React from "react";
export default function App() {
return (
<>
<AnimalGroupScreen />;
<ExpoStatusBar style="auto" />
</>
);
}
But I still get this error:
Error: Text strings must be rendered within a <Text> component.
This error is located at:
in App (created by withDevTools(App))
in withDevTools(App)
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
And of course I searched for this error. But I only have a Text tag in the Info component.
And that seems correct. So how to tackle this error?
2
Answers
remove ; from
<AnimalGroupScreen />;
You have a semicolon here:
Remove it and it should work.