You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository has been archived by the owner on Apr 6, 2023. It is now read-only.
I need to verify that the form has changed before the user leaves the screen.
For this it would be useful to have a function that returns if the data has changed in any way.
Português:
Eu preciso verificar se o formulário foi alterado antes que o usuário saia da tela.
Para isso seria útil se tivesse uma função que retornasse se os dados foram alterados de alguma forma.
Usage example
Exemplo: .isFormDirty()
useEffect(()=>{constunlisten=history.block(()=>{if(formRef.current?.isFormDirty()){return'Deseja sair sem salvar as alterações?';}});returnunlisten;},[formRef,history]);
The text was updated successfully, but these errors were encountered:
Devido a excelente arquitetura da lib que não ter estado interno para as input inputs, tive que adicionar um useRef que guarda o valor inicial do formulário, para poder comparar com o valor final do formulário.
Me pareceu fazer sentido que, esse valor inicial seja alterado pelos métodos de setData, reset, setFieldValue e clearFieldValue.
Veja o fluxo:
Formulário é exibido em tela, um initialData e passado ao componente de Form;
O initialData é armazenado no useRef, antes é convertido com o dot-object
O originalData.current pode ser alterado pelos métodos setData, reset, setFieldValue e clearFieldValue. Isso porque normalmente usamos eles para alterar os dados do form quando recebemos os dados da API, dessa forma, seriam esses os dados originais. Uma alteração de dados, que caracteriza o .isFormDirty() === true é quando o usuário interage com uma input, por exemplo.
.isFormDirty() é chamado para validar se o form foi alterado. Como seria validado:
Os possíveis dados alterados do formulário são buscados e transformados com o dot-object
Com um for in cada atributo do originalData.current é comparado com seu respectivo no currentDataAsKeyPair. O switch com o typeof é usado para contornar problemas de tipos de dados causados pelas inputs que retornam texto quando deveria ser número
Essa foi a regra usada para implementar a funcionalidade até agora, tudo que foi apresentado aqui está em aberto para discussão.
Description of issue
I need to verify that the form has changed before the user leaves the screen.
For this it would be useful to have a function that returns if the data has changed in any way.
Português:
Eu preciso verificar se o formulário foi alterado antes que o usuário saia da tela.
Para isso seria útil se tivesse uma função que retornasse se os dados foram alterados de alguma forma.
Usage example
Exemplo:
.isFormDirty()
The text was updated successfully, but these errors were encountered: