ReactJS中componentWillUpdate的确切用法是什么？

Question

我是这个ReactJS的新手,并开始学习组件生命周期.现在我怀疑componentWillUpdate和componetDidUpdate.我知道一旦你return true从shouldComponentUpdate功能发送,它会打电话componentWillUpdate.一旦组件更新,那么componetDidUpdate将调用.

我的问题是我们真的在做什么componetWillUpdate功能吗？我希望我们也不能setState在这个功能中使用.componentWillUpdate函数的确切用法是什么？什么时候有用？

Answer 1

该componentWillUpdate让你控制来操纵它接收新的道具或状态之前的组件.我通常用它做动画.让我们说,在删除dom之前,我希望平滑地将一个元素淡出视图.这有帮助.

 componentWillUpdate : function(newProps,newState){
    if(!newState.show){
        $(ReactDOM.findDOMNode(this.refs.elem)).css({'opacity':'1'});
    }
    else{
      $(ReactDOM.findDOMNode(this.refs.elem)).css({'opacity':'0'});;
    }
},
componentDidUpdate : function(oldProps,oldState){
    if(this.state.show){
        $(ReactDOM.findDOMNode(this.refs.elem)).css({'opacity':'1'});
    }
    else{
      $(ReactDOM.findDOMNode(this.refs.elem)).css({'opacity':'0'});;
    }
}

https://jsfiddle.net/zupoj3x6/

许多用例中的一个,特别是在动画方面.这个想法是为国家变革做准备.准备可以有很多方面,

• 您可能希望设置此特定状态的渲染可能需要的变量
• 你可能想要动画你的div或

• 派遣事件以清除/设置您的商店.

  无休止的用例.