【问题标题】:defaultProps function does not accept methods from component class (Parent Child Comunication)defaultProps 函数不接受来自组件类的方法(父子通信)
【发布时间】:2017-01-13 10:55:58
【问题描述】:

这是父代码,整个事情完美呈现,甚至道具函数 oncheckselection 也被孩子完美调用,但我无法将数据传递给我的反应组件方法 getchilddata 给我 undefined no properties 或其他一些错误。

class Supertest extends React.Component {

    constructor(props) {
        super(props);
        this.state = {selected : []};
    }
    componentWillReceiveProps(Nextprops) {
      console.log(Nextprops.onCheckSelection)
    }
    getchilddata(value) {
      alert('yolo')
    }
    render() {
        return (<div>
          <div>{SimpleTable(this.props)}</div>
          </div>);
    }

}

Supertest.propTypes = {
    headers: React.PropTypes.instanceOf(Immutable.List),
    descriptors: React.PropTypes.instanceOf(Immutable.List),
    data: React.PropTypes.instanceOf(Immutable.List),
    rowTransform: React.PropTypes.func,
    rowSelected: React.PropTypes.func,
    headerSelected: React.PropTypes.func,
    selectable: React.PropTypes.bool,
    onCheckSelection: React.PropTypes.func,
    prescanRows: React.PropTypes.bool
};

Supertest.defaultProps = {
    headers: List(headers),
    descriptors: List(descriptors),
    data: List(data),
    rowTransform: (() => List()),
    rowSelected: ((dataItem) => {}),
    headerSelected: ((header) => {}),
    onCheckSelection : ((items) => {this.getchilddata}),
    selectable: true,
    prescanRows: true
};

被调用的子函数。我可以在编辑父代码 oncheckSelection 时在控制台中打印数据。

    var checkSelection = function (value) {
        props.onCheckSelection(value)
}

【问题讨论】:

    标签: javascript reactjs ecmascript-6


    【解决方案1】:

    我认为 this 指的是您希望它指的不同的东西(this.getchilddata )。

    如何在类自身内部移动 onCheckSelection 函数,例如:

        onCheckSelection(value){
            this.getchilddata(value);
            if(this.props.getchilddata){
                this.props.getchilddata(value);
            }
        }
    

    【讨论】:

    • 您好,oncheckSelection 是一个道具函数而不是类函数。 props.onCheckSelection(value) 由孩子调用,我想将其绑定到类内的父函数并访问此 props 函数参数值
    猜你喜欢
    • 2022-06-23
    • 1970-01-01
    • 2020-11-10
    • 1970-01-01
    • 1970-01-01
    • 2016-07-18
    • 1970-01-01
    • 1970-01-01
    • 2023-03-22
    相关资源
    最近更新 更多