react native Functional component

 App name ----- Test 

component Name ------  App.js 

function component very easy they don't mange their state.

they are simple javascript function 

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


/**
* Sample React Native App
* https://github.com/facebook/react-native
*
* @format
* @flow strict-local
*/

import React from 'react'
import { View, Text, Button, } from 'react-native';
const App = () =>{
function Welcome(){
alert("Hello React-Native King, How are You ")
}
return(
<View>
<Text>Function Component </Text>
<Button title="Click Me" onPress={Welcome}/>
</View>
)
}
export default App;




Comments

Post a Comment

Popular posts from this blog

React Native FlatList

Image
 App Name: Test  Component Name: App.js ------------------------------------------------------------------------------------ import React , { useState } from 'react' ; import { StyleSheet , Text , View , FlatList , } from 'react-native' ; // class App extends Component { export default function App (){ const [ people , ] = useState ([ { name : 'ReactNative King' , id : '1' }, { name : 'ReactNative King' , id : '2' }, { name : 'ReactNative King' , id : '3' }, { name : 'ReactNative Kingaun' , id : '4' }, { name : 'ReactNative King' , id : '5' }, { name : 'ReactNative King' , id : '6' }, { name : 'ReactNative King' , id : '7' }, ]); // render() { return ( < View style = { styles . container } > < FlatList keyEtractor = { ( item ) => item . i...
Read more

React Native class component

Image
class component: class component access react lifecycle methods and render and state props functionality. app name : test component name: App.js ----------------------------------------------------------------------------------------------------------------------- /** * Sample React Native App * https://github.com/facebook/react-native * * @format * @flow strict-local */ import React , { Component } from 'react' import { View , Text , Button , } from 'react-native' ; class App extends Component { render () { function hello (){ alert ( "Welcome class component ReactNative King" ) } return ( < View > < Text > Class Component </ Text > < Button title = "Click Me " onPress = { hello } /> </ View > ) } } export default App ;
Read more