删除后如何刷新Vue表？

Question

我正在尝试删除vue表组件中的记录。一旦删除，记录将从数据库中删除，但记录不会自动从表中移开。任何人都可以帮助解决这个问题。我已经在表组件的代码和删除方法的下面发布了

。

我的桌子组件

port

删除方法

  <template slot="thead">
    <vs-th sort-key="id">Id</vs-th>
    <vs-th sort-key="name">Name</vs-th>
    <vs-th sort-key="phone_number">Phone No</vs-th>
    <vs-th sort-key="location">Location</vs-th>
    <vs-th>Action</vs-th>
 </template>

 <template slot-scope="{data}">
  <tbody>
    <vs-tr :data="tr" :key="indextr" v-for="(tr, indextr) in data">

       <vs-td>
        <p class="font-medium truncate">{{ tr.id }}</p>
      </vs-td>  

     <vs-td>
        <p class="font-medium truncate">{{ tr.first_name }}</p>
      </vs-td>  


      <vs-td>
      <p class="font-medium truncate">{{ tr.phone_number}}</p>
      </vs-td>

      <vs-td>
      <p class="font-medium truncate">{{ tr.location}}</p>
      </vs-td>

       <vs-td class="whitespace-no-wrap">
            <feather-icon icon="TrashIcon" svgClasses="w-5 h-5 hover:text-danger stroke-current" class="ml-2" @click.stop="deleteData(tr)" />
          </vs-td>

   </vs-tr>
  </tbody>
</template>