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

1 vote349 views1 answer
React native componentwillmount vs componentdidmount
Javascript React
0 vote396 views1 answer
How to add icon in react
Javascript React
0 vote371 views1 answer
React-data-table-component cell action
Javascript React
0 vote345 views1 answer
How to disable button if errors object isnt empty in react hook form
Javascript React
0 vote345 views1 answer
Fetchutils in react admin
Javascript React
0 vote381 views1 answer
Run react app in different port
Javascript React
0 vote352 views1 answer
Onclick hold react
Javascript React
0 vote358 views1 answer
Filter-vs-map-reactjs-and-jsx
Javascript React
1 vote363 views2 answers
React-native-screens
Javascript React
0 vote375 views1 answer
How to detect if app is loosing focuse in react native
Javascript React