TypeError：_this.props.menuData 不是 reactjs 中的函数答案

【问题标题】：TypeError: _this.props.menuData is not a function in reactjsTypeError：_this.props.menuData 不是 reactjs 中的函数
【发布时间】：2020-03-25 03:55:31
【问题描述】：

我试图在提交时从子组件传递一个对象，但我是出现上述错误

下面是子组件和父组件中的代码

overideChange = (e) => {
      let menuObj = {
            currency: e.target.currency.value
      }
      this.props.menuData(menuObj);             
}

<OlmiGridNavMenu  menuData={this.menuData} />

menuData(data) {
      console.log('data--->', data);
}

【问题讨论】：

标签： javascript reactjs ecmascript-6

【解决方案1】：

你需要绑定this

<OlmiGridNavMenu  menuData={this.menuData.bind(this)} />

【讨论】：

【解决方案2】：

在从父组件发送 menuData 函数作为 props 之前，将 this 绑定到该 props。

<OlmiGridNavMenu  menuData={this.menuData.bind(this)} />

或者您可以在类构造函数中将其绑定到 menuData。

class ParentComponent extends React.Component {
    constructor(props) {
        super(props);
        this.menuData = this.menuData.bind(this);
    }

    menuData(data) {
        console.log(data)
    }

   render() {
        return(
            <div>
                <OlmiGridNavMenu  menuData={this.menuData} />
            </div>
        );
   }
}

【讨论】：