Question

单击按钮时无法访问年龄！我得到警报但不是年龄。得到类似的东西＆＃39;他的年龄是[对象]＆＃39;。谢谢你！

class Hello extends React.Component {
  render() {
    return ( < div >
                <h1>{this.props.name}</h1>
                <button onClick={this.props.handleAge}>Click
                </button>
             < /div >
    )
  }
}

class App extends React.Component {

        alertAge (age) { 
        alert('His age is ' + age);
    }

  render() {

    return (
      <div>
         <Hello  name="Eric" age={25} handleAge={this.alertAge}/ >              
         <Hello name="Dyna" age={30} handleAge={this.alertAge}/ >
         <Hello name="Boss" age={8} handleAge={this.alertAge}/ >

      </div>
    );
  }
}

Answer 1

在Hello组件更改时，未使用您期望的参数调用您的函数：

<button onClick={() => {this.props.handleAge(this.props.age)}}>Click</button>

你需要包装它并传递你需要的变量。

Answer 2

您没有将变量传递给alertAge函数。

class Hello extends React.Component {
  render() {
    return ( 
        <div>
            <h1>{this.props.name}</h1>
            <button onClick={() => { this.props.handleAge(this.props.age) }}>
                Click
            </button>
        </div>
    )
  }
}

如何使用参数

2 个答案: