Comment afficher des lignes spécifiques dans l'API Vue.js

Question

Je veux juste demander comment afficher/obtenir les données de l'API dans ma zone de texte Lorsque vous cliquez sur le bouton Modifier dans un tableau de lignes spécifique. Il affichera son propre identifiant et d'autres détails. Je suis désolé d'avoir posté mon code comme ça, je ne sais pas quoi faire car cela me donne des erreurs.

Code original :

data : {
  students : []
}
methods: {
  async editStudents(edit) {
    let id = "621ecc95817b5aeb5783aebe"
    let a = await 
    this.$axios.get(`https://api.qa.sampleapi.com/students/${id}`)
    console.log(a.data.data)
}

Cela me donnera l'élément spécifique mais comment le faire en utilisant la boucle for.

Exemple de code :

editStudent(edit) {
  let studentid = id
  let a = await 
  this.$axios.get(`https://api.qa.sampleapi.com/students/${studentid}`)
  for(let i = 0; i < this.students.length; i++) {
    if(edit.studentid === this.students[i].studentid) {
      this.textbox1 = this.students[i].studentid;
    }
  }
}

Answer 1

Sur la base de ma compréhension, j'ai trouvé la solution suivante. S'il vous plaît dites-moi si cela répond à vos exigences.

Démo :

new Vue({
  el:"#app",
  data:{
    students: [{
        id: 1,
      name: 'Student 1'
    }, {
        id: 2,
      name: 'Student 2'    
    }, {
        id: 3,
      name: 'Student 3'   
    }]
  },
  methods: {
    editStudent(id) {
        console.log(id); // You will get the student ID here
    }
  }
});

sssccc

  

    

      {{ student.name }}
      Edit