How to pass prop from child component to child component. | Sololearn: Learn to code for FREE!

+1

How to pass prop from child component to child component.

Have to pass setScore function as prop from Nav.js to App.js to change the score value. App.js import logo from './logo.svg'; import './App.css'; import Nav from "./Component/nav.js"; function App() { return ( <div className = "App"> <div className = "nav"> <Nav /> </div> <button onClick={setScore(score + 1)}>Increment</button> </div> ); } export default App; ////////////////////////////// Nav.js import {useState} from 'react' import './Style Components/nav.css'; function Nav(){ const [score, setScore] = useState(0); return ( <div className = "nav-container"> <div className="score" id="score"> {score} {console.log(score)} </div> </div> ); } export default Nav;

1/21/2021 4:08:51 AM

Aman Kumar

4 Answers

New Answer

+5

App.js import React, {useState} from "react"; import logo from './logo.svg'; import './App.css'; import Nav from "./Component/nav.js"; function App() { const [score, setScore] = useState(0); return ( <div className = "App"> <div className = "nav"> <Nav score={score} /> </div> <button onClick={() => setScore(s=>s+1)}>Increment</button> </div> ); } export default App; ////////////////////////////// Nav.js import {useState} from 'react' import './Style Components/nav.css'; function Nav({score}){ return ( <div className = "nav-container"> <div className="score" id="score"> {score} </div> </div> ); } export default Nav;

+3

I learn from all the tutorial website from internet including youtube tutorials. https://www.google.com/search?ei=aQoKYN6iBKWc4-EPvK68aA&q=react.js+tutorial+-w3schools&oq=react.js+tutorial+-w3schools&gs_lcp=ChNtb2JpbGUtZ3dzLXdpei1zZXJwEAM6BAgAEEc6BQgAEMkDOgIIADoGCAAQFhAeOgkIABDJAxAWEB5QqG5Y1awBYOKxAWgAcAF4AIABjwGIAe8HkgEDOC4zmAEAoAEByAEIwAEB&sclient=mobile-gws-wiz-serp

+1

Will you tell where have you learnt react js from.

+1

Thanks