Question

我需要做的是使用一个值 setState ，然后通过道具将数据发送给孩子，但是我希望“状态”在做完一次之后就忘记了。

this.setState({ 
    animateId: 15 //or any number of id
});

然后再

if(this.state.animateId){
   let idToSent = this.state.animateId;
}
<Items <...different props> animate={idToSent}/> //once after settingState - 15, 
                                        // then undefined or whatever with every next time

我想只使用一次此值，通过道具发送它，然后就忘了它。

除了再次更改状态中的一个值之外，还有什么方法可以这样做，因为那样会导致不必要的渲染？

Answer 1

我们可以在任务完成后将其设置为undefined

this.setState({ doSomething: undefined });

Answer 2

我会根据最新道具与当地状态的比较，让Item组件跟踪何时以及何时不启动动画。

我不确定您是如何触发动画的，但是听起来您可以在Item组件中执行类似的操作

const { animateId } = this.props;

if (animateId !== this.state.animateId) {
  // Whatever code that starts your animation...

  // Then either update the state right away to signal the last animation
  // that was triggered, or if it can't be done here, then set it in a 
  // callback from when the animation is done.
  this.setState({ animateId });
}

请记住，如果这段代码是在render阶段执行的，那么它可能不允许您调用setState。

React-如何只一次渲染状态值

2 个答案: