Question

我知道setState是一个异步操作，因此我进行了一次同步调用，以确保在componentWillReceiveProps触发器之前更新状态值，但它仍显示我之前的值。这段代码写在我的子元素中。我怀疑在我父元素中要做的事情是什么？还是有其他原因？下面是我的代码

constructor(props) {
    super(props);
    this.state = {

      loading: false,
      yearValue:Number(localStorage.getItem('year'))//this is 2019

    };
  }
  componentDidMount() {

  }
  componentWillReceiveProps(nextProps) {
    console.log(
      'before if condition...',
      nextProps,
      Number(localStorage.getItem('year'))
    );
    if (
      this.state.yearValue ===
      Number(localStorage.getItem('year')) //this condition satisfied twice before it changed the value
    ) {
      console.log('inside if condition.....', nextProps);
      this.setSstate = {

        loading: false
      };
    } else this.setState({ loading: false });
  }
  updatePrograValues = year => {//year = 2017
    if (year === Number(localStorage.getItem('year'))) {
      this.props.showPlanYearValues(year);
    } else {


      this.setState({

        loading: true
      },this.props.tooltipRefresher());
    }
  };

Answer 1

如果我认为您;来电中的错误setState是问题中的拼写错误且不在实际代码中，则问题出在此处：

this.setState({
  loading: true
},this.props.tooltipRefresher());

调用 this.props.tooltipRefresher()，然后将其返回值传递到setState，与foo(bar()) 调用的方式完全相同 {{1}并将其返回值传递给bar。

如果你想在状态值更新后调用它，请从中移除foo，这样你就不会调用它，你将它传递给{{ 1}}所以()会在设置状态时调用它：

setState

如果它对setState的值敏感（例如，this.setState({ loading: true },this.props.tooltipRefresher); // No () --------------------^期望this为tooltipRefresher），则可能需要{{ 1}}：

this

...或箭头功能：

this.props

在反应中的setState之后不修改状态值

1 个答案: