ReactJS 动态更新状态

Question

我正在尝试根据回调函数发送的参数动态更新组件状态。

因此，目标是如果组件发送 valueChange('id', 1)... this.state.contractLine.id 将更新为 1 如果组件发送 valueChange('innerLevel.name', 'newName') this.state.contractLine.innerLevel.name 将更新为 newName

这是我正在使用的代码（但它没有像预期的那样工作）。

valueChange(statePath, inputValue) {
    var newState = this.state; 

    var stateBeingChanged = this.state['contractLine'];

    var pathList = statePath.split('.');
        for (var i = 0; i < pathList.length; i++) {
            var elem = pathList[i];
            stateBeingChanged = stateBeingChanged[elem];
        }

    stateBeingChanged = inputValue;

    newState['contractLine'] = stateBeingChanged;

    this.setState(newState);
}

有什么想法吗？

编辑——已解决——

万一有人遇到同样的问题... 我听从了 @rauliyohmc 的建议并设法解决了 lodash 的问题。使用的代码（比我想象的要简单得多）是：

valueChange(statePath, inputValue) {
    var newState = Object.assign({}, this.state['contractLine']);

    _.set(newState, statePath, inputValue);

    this.setState({contractLine: newState});
}

Answer 1

以防万一有人遇到同样的问题...我听从了@rauliyohmc 的建议并设法用 lodash 解决了这个问题。使用的代码（比我想象的要简单得多）是：

valueChange(statePath, inputValue) {
    var newState = Object.assign({}, this.state['contractLine']);

    _.set(newState, statePath, inputValue);

    this.setState({contractLine: newState});
}

ReactJS 动态更新状态

ReactJS update state dynamically

javascript

state

dynamic

reactjs