Je crois que dans toute application, il devrait y avoir une source de vérité.
Mon application va avoir
Donc, dans React, j'ai trouvé trois endroits confus pour stocker l'état:
Le formulaire Redux n'enregistre pas les champs cachés. Pour enregistrer des champs cachés, vous devez créer un champ avec un attribut désactivé, etc.
Si vous effectuez des calculs tels que , AMOUNT = QTY * RATE; Ici, l'utilisateur entrera QTY et RATE et AMOUNT sera calculé. Ici, il va immédiatement refléter l'état du composant, mais pas celui de la forme redux. Pour le faire refléter sous forme de redux, nous devons tirer.
this.props.dispatch(change('Invoice', 'amount', 55))
Il ne sera pas toujours possible d'éviter l'état des composants, si j'écris, le code de la formule de calcul ressemblera à ceci
Seulement l'état de forme Redux
const amount = someReduxFormApiGet(QTY) + someReduxFormApiGet(RATE) this.props.dispatch(change('Invoice', 'amount', 55))
Seulement réagir état
onChange(){ will have set QTY & RATE in component state} const amount = this.state.QTY * this.state.RATE
Conclusion: Si je vais avec redux-form
, je devrai écrire du code supplémentaire pour rendre redux-store stable en synchronisation, alors que, dans l'état du composant React, j'aurai la fonction handleChange()
qui dessinera l'état dans this.state
. Je pense aussi que je vais avoir beaucoup de flexibilité dans l'état des composants
Si mon modèle de données devient plus complexe, il sera très difficile à gérer dans le magasin redux-form. Alors là, je pense à ne pas utiliser redux Magasin personnalisé OR Etat du composant
D'autres bibliothèques qui valident les entrées React n'utilisent pas Redux pour implémenter la validation. C'est juste redux-form qui utilise redux pour gérer la validation.
J'ai donc conclu que
Redux-form est né juste pour validation et pas pour gérer un modèle de données complexe.
Les modèles de données complexes doivent être gérés en conséquence dans l'état du composant OR du magasin personnalisé redux
D'après la documentation de Redux-form, il gère très bien la validation, mais aux fins de la modélisation des données, il suggère des solutions qui ne sont pas tout à fait simples.
Besoin d'aide pour décider
Devrais-je utiliser le magasin redux-form pour la modélisation de données
OR
juste utiliser pour la validation
ET
utiliser l'état du composant et le magasin redux personnalisé pour modéliser les données?
Si vous n'avez pas besoin d'exécuter des tâches asynchrones, c'est-à-dire des validations de formulaire async, il est facile de créer un composant générateur de formulaire personnalisé au lieu d'utiliser redux-form qui est beaucoup plus complexe, ajoute une couche supplémentaire de passe-partout et vous oblige à utiliser redux . Pour réf. check it . https://github.com/bietkul/react-native-form-builder
J'ai créé une nouvelle bibliothèque, React-chopper .
Une reliure bidirectionnelle révolutionnaire dans React qui répondra à toute complexité d'objet métier, presque comme AngularJS.
Prendre plaisir! Code comme AngularJS dans React.
Je recommanderais d'utiliser Redux-Form uniquement pour la collecte et la validation des données. Utilisez votre propre état de composant et/ou votre magasin redux personnalisé, le cas échéant.
Vous avez raison d'utiliser uniquement redux pour un état à partager. Gardez les choses simples et réutilisables.
Bonne lecture:
https://goshakkk.name/should-i-put-form-state-into-redux/
https://hackernoon.com/using-forms-in-react-redux-tips-and-tricks-48ad9c7522f6
https://medium.com/dailyjs/why-build-your-forms-with-redux-form-bcacbedc9e8