0
Je suis un débutant à Réagir JS et en essayant de faire une application simple avec des contrôles directionnels pour déplacer un objet vers le bas à gauche à droite. Je prévois de créer 2 composants <Object /> et <Controls /> (composé de 4 boutons) avec des gestionnaires d'événements pour mettre à jour position state du composant <Object />. Mais je rencontre 2 problèmes:Réagissez JS: Concevoir une application avec des contrôles pour déplacer un objet
- Où stocker le
position state? Si je comprends bien, l'architecture de flux ne permet pas au composant<Controls />de mettre à jour l'état du composant<Object />. - Comment écrire un seul gestionnaire d'événements pour servir 4 boutons similaires (haut, bas, gauche, droite)? Vous pouvez écrire 4 fonctions distinctes, mais est-il possible d'en utiliser une seule?
Pourriez-vous nous conseiller la bonne façon d'aborder les 2 questions ci-dessus?
Merci beaucoup!
mockup: control buttons to move objects
Merci beaucoup Filipe, c'est excellent. Puis-je demander si j'ai besoin de plusieurs composants pour mettre à jour chaque autre état, le motif est toujours de stocker le 'state' au composant parent et de les transmettre aux enfants via' props'? – quynhu
En ce qui concerne la question 2, est-ce commun avec react js que le gestionnaire d'événements identifie quel bouton est cliqué en utilisant, par exemple, 'event.target',' refs', ou 'key'? Ou existe-t-il un autre moyen d'utiliser le paramètre id pour les fonctions du gestionnaire d'événements? – quynhu
Si vous regardez redux, l'état est stocké à la racine même de l'application; alors oui, que le statu quo actuel de la façon d'organiser les données. À propos de votre deuxième question, vous pouvez identifier des événements de ce genre, mais d'après mon expérience, il est plus facile de tester et de réutiliser des fonctions si elles ne dépendent pas de l'objet événement et reçoivent des arguments normaux à la place. –