Substituir ‘componentWillReceiveProps’ por ‘getDerivedStateFromProps’
Com o lançamento do React 16.3, alguns novos métodos de ciclo de vida foram introduzidos, e a liberação do React 17 irá depreciar algum método de ciclo de vida.
getDerivedStateFromProps
é um desses métodos de ciclo de vida recentemente introduzidos substituindo componentWillReceiveProps
, que agora se tornou UNSAFE_componentWillReceiveProps
.
getDerivedStateFromProps
é um método estático que é invocado depois que um componente é instanciado, bem como quando ele recebe novos adereços. Como é um método estático, você não pode acessar this
dentro deste método nem pode acessar qualquer outro método de classe. Ao contrário de componentWillReceiveProps
você não pode definir estado dentro deste método, então a única maneira de atualizar o estado é retornando um objeto. Se você não quiser atualizar nenhum estado, simplesmente retorne null
.
Vamos mergulhar em algum código
Esta é a forma como componentWillReceiveProps
funciona.
Comparamos nextProps.someValue
com this.props.someValue
e se ambos são diferentes então realizamos alguma operação, setState
e chamamos this.classMethod();
.
Agora vamos ver como getDerivedStateFromProps
funciona.
Recebe dois params nextProps
e prevState
. Como mencionado anteriormente você não pode acessar this
dentro deste método então você terá que armazenar os adereços no estado para comparar os nextProps
com os adereços anteriores. No código acima nextProps
e prevState
são comparados, se ambos são diferentes então um objeto será retornado para atualizar o estado, caso contrário null
será retornado indicando que a atualização do estado não é necessária. Se o estado mudar então componentDidUpdate
é chamado onde podemos executar as operações desejadas como fizemos em componentWillReceiveProps
.
.
Leave a Reply