[Vuejs]-How to display specific row in vuejs api

by

0👍

As per my understanding I came up with below solution. Please let me know if it works as per your requirement or not.

Demo :

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
    }
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  <ul class="list">
    <li v-for="student in students" :key="student.id">
      {{ student.name }}
      <button @click="editStudent(student.id)">Edit</button>
    </li>
  </ul>
</div>

Leave a comment