从子组件访问父组件的数据

Question

我正在尝试将数据从子组件传递到父组件，然后触发setState。

Parent.jsx

onChildChange(cv) {
  // do something . NEED TO ACCESS cv here!!!!
}
render() {
  return <MyClild childValue={switchVal} onChildChange={ this.onChildChange(cv) }/>;
}

Child.jsx

render(){
  let valuefromchild='blah blah';
  return(
    <div onClick={ this.props.onChildChange(valuefromchild) } >
    </div>
  );
}

Answer 1

您正在执行函数而不是作为参数传递。相应地将代码更改为以下内容。

onChildChange(cv) {
  console.log(cv);
}
render() {
  return <MyClild childValue={switchVal} onChildChange={ this.onChildChange }/>;
}

render() {
  let valuefromchild = 'blah blah';
  return (
    <div onClick={ (event) => this.props.onChildChange(valuefromchild) } >
    </div>
  );
}