je voudrais créer en vuejs avec vscodium une application 
pour éditer et mofifier  un fichier components/data.json :
[{"Etape":1,"Essai":1,"Type":"egaux","Présentation":"tagada"},
{"Etape":2,"Essai":4,"Type":"différents","Présentation":"areuh bouzou"}]
composée de main.js, App.vue, components/Editeur.vue ;  le composant Editeur.vue  devrait être en mesure
de lire le fichier data.json, de donner à voir le contenu de "Type" et "Présentation". 
Deux boutons, l'un  donnera la possibilité de modifier ces champs, l'autre pour confirmer les modifications, 
on ne verra qu'un bouton à la fois. 
Un troisième bouton pour ajouter une nouvelle ligne au fichier  data.json. 
Un dernier pour sauvegarder le fichier  data.json en local. 

Pouvez-vous me montrer les 3 sources  main.js, App.vue, components/Editeur.vue, et les méthodes utilisées dans le composant ? 
 
Ok Mais le code ci-dessous n'affiche pas le contenu des champs de data.json

Commençons par quelque chose de plus simple : 
le répertoire src contient : 
App.vue
components/Editeur.vue
components/data.json
main.js
:; cat components/data.json
[{"Etape":1,"Essai":1,"Type":"egaux","Présentation":"tagada"},
{"Etape":2,"Essai":4,"Type":"différents","Présentation":"areuh bouzou"}]

Pouvez-vous me proposer une version de components/Editeur.vue
capable d'afficher les champs Type et Présentation 

Cela fonctionne.  Pouvez-vous améliorer ce code pour que    le composant Editeur.vue  soit en mesure continuer de  donner à voir le contenu de "Type" et "Présentation" et d'ajouter 
Deux boutons, l'un  donnera la possibilité de modifier ces champs, l'autre pour confirmer les modifications, 
on ne verra qu'un bouton à la fois. 
Un troisième bouton pour ajouter une nouvelle ligne au fichier  data.json. 
Un dernier pour sauvegarder le fichier  data.json en local. 
Donnez-moi , svp, l'ensemble du source du composant  Editeur.vue   



Cela fonctionne pour montre et modifier la première ligne et sauvegarder le fichier data.json.
En revanche;Il nous faut apporter une correction : quand on crée une nouvelle ligne 
les modifications sont apportées à la première ligne et la nouvealle ligne ajoutée à data.json 
ne contient rien dans les champs Type et Présentation. 
Puis-je avoir une version complète et corrigée ?  

Reprenons. Essayons de corriger le problème posé, à savoir :
"quand on crée une nouvelle ligne les modifications sont apportées à la première ligne
et la nouvelle ligne ajoutée à data.json ne contient rien dans les champs 
Type et Présentation. " en prenant en considération le premier champ "Etape". 
Modifier le composant Editeur.vue pour qu'il affiche le numéro d'"Etape", 
qu'il autorise  l'édition d'une "Etape" par son identifiant (ie 1 ou 2 ou autre) 
et que la nouvelle ligne ait pour numéro d'"Etape" un nouveau numéro.    
Donnez-moi, svp, le source complet. 

Quand je choisis une ligne dans le champ Sélectionner Étape et que je relache
la souris, l'affichage montre les champs Etape et Présentation mais ils sont
vides. Pourrait-on présenter le contenu de ces champs sans attendre de presser
le bouton modifier ? Puis-je avoir le fichier entier et corrigé ?