React, ask. There is a set of child components in the parent component, how to pass the value obtained by the operation in the child component back to the parent component by clicking the button of the parent component.

clipboard.png

recently, I encountered a problem in my internship. I was a little annoyed, but I really couldn"t figure it out at the moment. React newcomer, want to come to the forum to ask the big gods what they think. "br > is like this. I now have a product table,table that has an interface to get data. The data is the id and related information of a group of goods. This data is changing all the time, so the number of these goods is also changing."
I just pass the product data into the subcomponent product cell, and product.map (product= > < ProductCell product= {product} / >) shows the product table.
now I need to have a small input box in the merchandise box product cell to fill in the numbers, and then there is a button in product table. I click this button, and I hope to get the input numbers of these goods and their corresponding id, in table. With such an array of ARRAY < order:Int, id: string >, I can sort in table, and then sort the sorted array with another api to save sorting information.

my question is: how do I get the information about the numbers in product cell in table? I know that setting call back in props allows a child component to send information to the parent component, but now there are multiple child components, the total number of which is uncertain, and the trigger condition for getting this information is whether or not to click the button in the table. I"m a little confused

if someone who is handsome and kind-hearted is willing to give advice, thank you very much.

React.js
Mar.25,2021

knows that setting callback to get data through props saves all the data in the state of the parent component, and then the child component dynamically modifies the state value in the parent component as soon as the child component changes, and finally the parent component only needs to take the value in its own state when it is submitted. The general idea of
is that all the data sources of the child component are the state, of the parent component, including input,. When the input is modified, the onChange method is triggered to change the state, in the parent component. When the parent component is finally submitted, it only needs the parent component to read its own state

.

the positive solution of the answer upstairs, in a word: pass the function through props, and the subcomponent calls the function to achieve the purpose of passing value.

for example: 

 <div>
    <Child callback={this.callback}/>
 </div>

 callback=(params)=>{
   //paramscallback
 }

at the technical level, the two upstairs have already answered. I think the train of thought needs to be changed. After the value of the child component is changed, it should be passed to the parent component. The parent component only needs to click the button to deal with the existing data

.

Previous: How to output the progress without line wrapping and refresh the display in the same location in Python?

Next: Scrapy sends CAPTCHA after downloading url, there is a 405 error in simulated login.

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu