Pass Simple Values to Component in React Functional Components

This project will demonstrate how to Pass Simple Values to Component in React Functional Components

  • ReactFunctionalComponents
    • src
      • App.js
      • index.js
import React from 'react';

function App() {

    let age = 20;
    let username = 'abc';
    let status = true;
    let price = 4.5;

    return (
        <div>
            <DislayValues age={age} username={username} status={status} price={price} />
        </div>
    );

}

function DislayValues({ age, username, status, price }) {
    return (
        <div>
            age: {age}
            <br />
            username: {username}
            <br />
            status: {status}
            <br />
            price: {price}
        </div>
    );
}

export default App;
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(<App />, document.getElementById('root'));

serviceWorker.unregister();

Screenshots