Question

我有一个反应中的子组件，我想通过调用一个函数并给出键和值来修改父组件。理想情况下它会像这样

var FirstView = React.createClass({

handleStateChange: function(key, value) {
    this.setState({
        key: value
    });
}.

render: function() {
    return (
        <div>
            <SecondView onStateChange={this.handleStateChange} />
        </div>
    )
}
});

var SecondView = React.createClass({

handleClick: function() {
    this.props.onStateChange('theParent', 'isNowChanged');
},

render: function() {
    return (
        <div onClick={this.handleClick}>Stack Overflow</div>
    );
}
})

我不完全确定这是否是解决此问题的最佳方法，但我想传递一个关键字和上面的值。不幸的是，反应并不想打球，而且父母的状态似乎没有改变。有没有合理的方法来解决这个问题？

谢谢！

Answer 1

在FirstView的handleStateChange中，您有以下内容：

handleStateChange: function(key, value) {
    this.setState({
         key: value
     });
}.

传递给setState的词典使用文字key而不是传递给key函数的变量handleStateChange。请尝试以下方法：

handleStateChange: function(key, value) {
    newState = [];
    newState[key] = value;
    this.setState(newState);
},

使用键值修改父组件状态

1 个答案: