Reactjs 如何将信息从子组件传递到父组件中的函数？（本地反应）

我有一个具有10个按钮的表示子组件，如下所示

  <Button onPress={...} title="1" />
  <Button onPress={...} title="2" />
  <Button onPress={...} title="3" />
  ...

---

如何在不编写10个函数的情况下从子组件的按钮中获取数字？

您正在查找React或React native中名为回调的概念

您将在父组件中具有事件处理程序函数。若您的事件处理函数是一个常规函数，那个么请确保在构造函数中绑定它或将其更改为箭头函数

因为您使用的是普通函数，所以需要像

  constructor(props){
      super(props);
      this.checkNumber = this.checkNumber.bind(this);
  }

  checkNumber(e, number){
       ...
     return number
   }

或者使用箭头功能。您不需要在构造函数中手动绑定它

  checkNumber = (e, number) => {
       ...
     return number
   }

现在将checkNumber函数作为道具传递给您的呈现组件，如

    <PresentationalComponent checkNumber={this.checkNumber} />

在你的表现部分

     <Button  onPress={e => this.props.checkNumber(e, 1)} title=“1”/>
    <Button onPress={e => this.props.checkNumber(e, 2)} title="2" />
      .......
      .......
      <Button onPress={e => this.props.checkNumber(e, 10)} title="10”/>

this.props.checkNumber（e，1）}title=“1”/
this.props.checkNumber（e，2）}title=“2”/>
.......
.......
this.props.checkNumber（e，10）}title=“10”/>

---

请原谅，如果有任何打字错误，因为我在手机中回答：）

您能提供更详细的代码，可能是父组件，以及如何调用子组件吗？

     <Button  onPress={e => this.props.checkNumber(e, 1)} title=“1”/>
    <Button onPress={e => this.props.checkNumber(e, 2)} title="2" />
      .......
      .......
      <Button onPress={e => this.props.checkNumber(e, 10)} title="10”/>