VueJS - Echange de données entre composants

Par Twentyfour, il y a 8 ans

Javascript

Bonjour à tous,

Mon problème est spécifique à Vue.js

Actuellement j'ai deux composants:

  1. une Table qui affiche les données d'une collections de livres. Ce composant me permet également d'ajouter et supprimer un livre de la collection.

  2. Un Formulaire qui me permet d'ajouter et modifier les données d'un livre en particulier.

Lors de la saisie des données dans le composant Table, je souhaiterais transférer ces données au composant Formulaire.

A défaut de me donner une solution, si vous arrivez à m'indiquer quel chapitre de la documentation règle mon problème, je serais déjà satisfait. Car honnêtement je mis perd un peu.

Je n'arrive pas à comprendre si mon problème est dû aux liaisons entre les classes ou aux templates, ou tout simplement un problème de conception de ma part.

Merci de m'éclairer

2 réponses

balo, il y a 8 ans

Tout dépend de la hiérarchie de tes deux composants :

  • Si tu veux passer tes données d'un composant parent vers enfant, tu peux utiliser les props (j'imagine que tu n'es pas dans ce cas là).
  • Si tu veux remonter des données de l'enfant vers le parent, tu peux utiliser un bus d'évenement.
  • Enfin, si tes deux compostants sont frères (ou même parent/enfant), je te conseille vuex qui résout tous les problèmes de transmission de données puisque le state est partagé. C'est la solution à privilégier je pense.
Twentyfour, il y a 8 ans

Merci balo

En effet, je n'arrive pas au résultat attendu avec les props et les bus d'événements. Donc vuex semble plus approprié à mon besoin.

Je m'en vais étudier tout ça.

Merci encore