React中子组件和父组件之间传值
最近公司的项目在用react,所以才开始接触react,react和vue一样,都是组件化的框架,那么子组件和父组件之间怎么传值呢?父组件向子组件传值 ,父组件通过属性的形式向子组件传递参数,子组件用过props接受父组件传递过来的参数;父组件代码:<todoItem content={item}/>//todoItem 是子组件的class,通过content...
·
最近公司的项目在用react,所以才开始接触react,react和vue一样,都是组件化的框架,那么子组件和父组件之间怎么传值呢?
- 父组件向子组件传值 ,父组件通过属性的形式向子组件传递参数,子组件用过props接受父组件传递过来的参数;
父组件代码:
<todoItem content={item}/>
//todoItem 是子组件的class,通过content属性,把item的值传给子组件
子组件代码:
<div>{this.props.content}</div>
//在子组件里需要数据的地方就可以直接用,通过prop接收
- 子组件向父组件传值 ,子组件需要调用父组件传递过来的方法进行通信
子组件代码:
<div onClick={this.handleDelete.bind(this)}>{this.props.content}</div>
handleDelete(){
this.props.parentDelete(this.props.content);
}
//子组件通过父组件传过来的属性parentDelete调用了父组件的handleDelete方法,同时把参数参过去
父组件代码:
<todoItem parentDelete={this.handleDelete.bind(this)} content={item}/>
handleDelete(item){
console.log(item);
}
//父组件通过handleDelete方法接受子组件传过来的参数
以上,初学react,刚入门,有问题还请多指教
更多推荐
已为社区贡献2条内容
所有评论(0)