Home > Mobile >  How do you fix an Unterminated JSX contents?
How do you fix an Unterminated JSX contents?

Time:06-29

I have been using react-native to try and create just a simple app. However, I am very new to this and I have no clue what I am doing. This is my code:

import React from 'react'
import { View, Text, Button } from 'react-native'
import { useNavigation } from "@react-navigation/core";

const HomeScreen = () => {

   const navigation= useNavigation();
   return (
       <View>
         <Text>I am the home screen<Text/>
         <Button title="Go to Chat Screen"
         onPress={() => navigation.navigate("Chat")}
         />
       </View>
   )
}
export default HomeScreen

Here is the error:

SyntaxError: C:\Users\Owner\CornellDatingRemix\screens\HomeScreen.js: Unterminated JSX contents. (13:15)

  11 |           onPress={() => navigation.navigate("Chat")}
  12 |           />
> 13 |         </View>
     |                ^
  14 |     )
  15 | }
  16 | export default HomeScreen

How do I fix this?

CodePudding user response:

You just have a typo:

const HomeScreen = () => {

   const navigation= useNavigation();
   return (
       <View>
         <Text>I am the home screen<Text/> /// should be </Text>
         <Button title="Go to Chat Screen"
         onPress={() => navigation.navigate("Chat")}
         />
       </View>
   )
}
export default HomeScreen
  • Related