React two way binding

One way binding react

In our case, it is easy to identify that the state should reside in the “Parent” component.

const [text, setText] = useState(“Hello”);

Now, what do we do to the “Parent” component? We pass the callback function as a prop from the parent component.

<Child changeText={(text) => setText(text)} />

Now we need a callback function in the “Child” component that is triggered when the button is clicked.

<button onClick={() => props.changeText(“World”)}>

Source: dev.to

Similar codes

0 vote377 views1 answer
Set default types react
Javascript React
85 votes334 views6 answers
Redirect react router
Javascript React
24 votes386 views6 answers
Proptypes react
Javascript React
0 vote408 views2 answers
React Class components LifeCycles
Javascript React
0 vote370 views1 answer
Javascript react useState update object
Javascript React
18 votes388 views4 answers
React for loop in render
Javascript React
0 vote335 views2 answers
Toggle classname onclick react
Javascript React
4 votes462 views2 answers
Concurrently node react
Javascript React
0 vote376 views1 answer
Module not found: Can't resolve '@date-io/date-fns' in 'C:\Users\61455\Documents\React apps\mya2o\src\pages'
Javascript React
1 vote343 views1 answer
How to use array of object in react
Javascript React