ElementUI中子组件如何向父组件传递数据？

嘿，关于ElementUI里子组件给父组件传值的问题，最常用的方案就是通过函数属性来实现，我给你拆解下具体的代码实现和注意点：

父组件代码实现 #

首先在父组件里定义一个接收数据的方法，并且一定要记得在构造函数里绑定this，不然调用时this的指向会出问题：

getData(val) { 
  console.log(val); // 这里就能拿到子组件传过来的值啦
}
// 记得在构造函数里绑定this：constructor(props) { super(props); this.getData = this.getData.bind(this); }

render() {
  return(<Child sendData={this.getData}/>); // 把这个方法通过props传给子组件
}

子组件代码实现 #

在子组件里，当你需要传递数据的时候，直接调用父组件传过来的函数，把要传递的值作为参数传进去就行：

demoMethod() {
  const value = '我是子组件要传递的数据'; // 这里可以是你实际要传的内容
  this.props.sendData(value);
}

这个方案的核心思路就是：父组件把一个回调函数通过props传给子组件，子组件在需要传值的时候调用这个函数，把数据作为参数传递，父组件就能在回调里拿到子组件的数据啦。

内容的提问来源于stack exchange，提问作者doUWannaBuildASnowMan