来自子组件的父级的setState是否具有React中的键值对?

时间:2017-11-06 05:30:04

标签: reactjs

我有一个带有表单的子组件。当用户提交表单时,我需要更新顶级组件中的状态。

通过阅读文档,我相信正确的方法是创建一个函数来更新父组件中的状态,然后通过执行它的props将其传递给子组件。

在我的孩子组件中:

  submit(e) {
    e.preventDefault();
    const setLength = parseInt(this.setLength.value.slice(0, -1));
    const restLength = parseInt(this.restLength.value.slice(0, -1));
    const noOfSets = parseInt(this.noOfSets.value);
    const noOfRounds = parseInt(this.noOfRounds.value);
    this.props.run(setLength, restLength, noOfSets, noOfRounds);
  }

在我的父组件中:

run(setLength, restLength, noOfSets, noOfRounds) {
    this.setState({
      setLength,
      restLength,
      noOfRounds,
      noOfSets,
      setTimeRemaining: setLength,
      restTimeRemaining: restLength,
      currentSet: 1,
      currentRound: 1,
      resting: false
    }, () => {
      this.updateProgress('running');
    });
  }

  render() {
    return (
      <Child run={this.run}/>

我上面的代码有效,但似乎很容易出错。如果我在任一函数中更改setLength, restLength, noOfSets, noOfRounds的顺序,则将设置错误的值。因此,我应该传递一个具有键值对的对象吗?或者我从根本上以错误的方式解决这个问题

0 个答案:

没有答案