react组件之间传值

react组件之间传值

父组件向子组件传值

1. 在父组件上边找到子组件标签 在子组件标签上写 自定义名字={要发送的数据}

   <子组件标签 自定义名字={要发送的数据}></子组件标签>

2. 在子组件的模板中直接使用{this.props.自定义名字} 来获取父组件向子组件传递数据

   <p>{this.props.自定义名字}</p>

子组件向父组件传值

1. 在子组件上绑定事件 通过this.props.自定义属性名(要发送的数据)

   <button onclick={this.方法名.bind(this)}></button>

   方法名(){this.props.自定义属性名(要发送的数据)}

2. 在父组件中找到子组件标签 在子组件标签上边写上: 自定义属性名={this.新的方法名.bind(this)}

3. 在父组件中编写新的方法 同时接收一个参数 这个参数就是子组件传递过来的数据

   新的方法(data){console.log(data)}