React Native | State and Props in Class Component

 App.js:

import React, { Component } from 'react';

import { Button, Text, TextInput, View } from 'react-native';

import Student from './components/Student';

class App extends Component {

    constructor(){

        super();

        this.state={

            name:"Krishan",

        }

    }

    updateName(val){

        this.setState({name:val})

    }

    fuit = () => {

        console.warn("Apple");

    }

    render() {

        return (

            <View>

                <Text style={{ fontSize: 30, backgroundColor: 'blue', color: 'white', marginBottom:10 }}>Class Component {this.state.name}</Text>

                <TextInput style={{ borderColor: 'black', borderWidth: 5, marginBottom:10 }} placeholder='Enter text' onChangeText={(text)=>this.updateName(text)}/>

                <Button style={{marginBottom:10}} title='Press Me' onPress={this.fuit}></Button>

               <Student name={this.state.name}/>

            </View>

        )

    }

}

export default App;

-----------------

Student.js:

import React, { Component } from 'react';

import { Button, Text, TextInput, View } from 'react-native';

class Student extends Component {

   

    render() {

        return (

            <View>

                <Text  style={{ fontSize: 30, backgroundColor: 'black', color: 'white', marginTop:10 }}>Student Component : {this.props.name}</Text>

               

            </View>

        )

    }

}

export default Student;