Question 186254 in React native Question posted in
The official React Native documentation can be found here.

How do you use React Native hooks correctly?

I am trying to learn how to use React Native hooks and create reusable components once I call GetPlayer, nothing appears on my screen when running my code and I am not getting any exceptions in my Console.

Am I calling the GetPlayer component correctly or is there something I am missing? thanks

App.js File below

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import GetPlayer from './GetPlayer';

export default function App() {
  return (
    <View style={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
         <GetPlayer /> 
      <StatusBar style="auto" />
    </View>
  );
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

GetPlayer.js file

import { View } from "react-native-web"


export default function GetPlayer(){
    return (
        <View style={styles.container}>
            <Text>Test </Text>
        </View>
    )
}

const styles = StyleSheet.create({
    container: {
      flex: 1,
      backgroundColor: '#fff',
      alignItems: 'center',
      justifyContent: 'center',
    },
  });

Image of folder

enter image description here

Tags:

3

Answers


  1. 0

    You need to add import Text component in order to write something
    on screen just like this

    import { View } from "react-native-web"
import { StyleSheet, Text } from 'react-native';


export default function GetPlayer(){
    return (
        <View >
            <Text>Tesdkasjdnb </Text>
        </View>
    )
}
    Login or Signup to reply.
  2. 0

    In GetPlayer.js file try below imports and Text component is also not imported

    import { Text, View } from 'react-native';
    Login or Signup to reply.
  3. 0

    Try making changes to the flex:1 style in App.js and I think you don’t need to apply flex:1 in GetPlayer.js also.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search