[Vuejs]-Append the search result in the input search field vue

by

0👍

✅

Instead of passing customer.id to the action method, you can pass customer object as parameter to action.
You can do something like this.

var vm = new Vue({
    el: '#app',
    data: {
      search: "",
      filteredCustomer:[{name:'test1',id:1},{name:'test2',id:2},{name:'test3',id:3}]
   },
   methods: {
      action (customer) {
       this.search=customer.name
       this.filteredCustomer=this.filteredCustomer.filter(o=> o.id!=customer.id)
      }
   }
    
});
h2{cursor:pointer}
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js" type="text/javascript"></script>

<div id="app">				

  
  <input class="search" type="text" name="search" v-model="search"  placeholder="Search posts..."
      >
<div >
  <div class="post" v-for="customer in filteredCustomer">
    <h2 href @click="action(customer)">{{ customer.name }}</h2>
  </div>
</div>
</div>

Leave a comment