Showing posts with label Function component. Show all posts
Showing posts with label Function component. Show all posts

2 February 2020

Function component in react native


  • Function component example in react native
import React from 'react';
import {  Text, } from 'react-native';

 const  HomeScreen=()=> {
  return (
      <Text>Adi here...</Text>
  );
}
export default HomeScreen;

11 January 2020

Props in functional component react

  • Create Components folder under src folder
  • Add PopsInFunEXP1.js file and add below Code
import React from "react";

function PopsInFunEXP1(props) {
return (
<div>
Pops In Fun EXP1
<p>{props.Name}</p>
<p>{props.Id}</p>
</div>
);
}

export default PopsInFunEXP1;
PopsInFunEXP1.defaultProps = { Name: "JC" };
  • Open index.js file and update code as below
import React from "react";
import ReactDOM from "react-dom";
import PopsInFunEXP1 from "./component/PopsInFunEXP1";

import "./styles.css";

function App() {
return (
<div className="App">
<PopsInFunEXP1 Name="adi" Id="100" />
</div>
);
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

Output: