React 16.4允许从状态更改中调用getDerivedStateFromProps。如何应对?

时间:2018-06-18 12:44:32

标签: javascript reactjs react-16

所以16.4“修复了”getDerivedStateFromProps中的一个错误,现在它在道具更改和状态更改时被解雇了。显然这是有意的,来自这篇文章:https://github.com/facebook/react/issues/12898。然而对我来说,在州内保存以前的道具是一个重大的过度杀伤,所以我问是否有人已经制定了一个程序来处理这样的案件:

class Componentche extends React.Component {
  state = {
    valuesForInput: {
      input1: ''
    }
  }
  static getDerivedStateFromProps(props, state) {
    if (props.someInitialValuesForInput.input1 !== state.valuesForInput.input1) {
      return {
       valuesForInput: {
         ...state,
         input1: props.someInitialValuesForInput.input1
       }
      }
    }
   return state;

   render () {
      <Input value='valuesForInput.input1' onChange='(e) => setState({valuesForInput: {...this.state, input1: e.target.value }})'
   }
}

所以在上面这种情况下,我永远不会改变输入,因为getDerivedStateFromProps将在接收到的新道具和setState触发器上执行,并且我的条件永远不会是假的。

那么处理这种情况的正确方法是什么?我是否需要真正保留状态中的旧道具并将其用于条件?

我刚看到这个post from React,但他们没有提供可行的替代方案。

感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

解决这个问题的主要思想总是使用一种真理。

实际上,他们提供了2种推荐的解决方案,在该博文中根本没有使用getDerivedStateFromProps

  1. Fully controlled component
  2. Fully uncontrolled component with a key

以及2个替代方法:

  1. 使用extra prop跟踪getDerivedStateFromProps
  2. 结合使用instance methodref