Небольшой вопрос по Vue.js

  let App = new Vue({ 
    el: "#app", 
    data: () => ({ 
      users: [{ id: 1, Name: 'Serega' }, 
        { id: 2, Name: 'Andrey' }, 
        { id: 3, Name: 'Shenia' },], 
        idDeleteUser: {}, 
    }), 
    methods: { 
      setDeleteUser(id) { this.idDeleteUser = id }, 
      deleteUser() { 
        let index = this.users.reduce((result, user, index) => user.id == this.idDeleteUser ? index : result, null) 
        this.users.splice(index, 1) 
        $("#exampleModalLong").modal('hide') 
      } 
    } 
  })

<script src="https://unpkg.com/vue@2.5.16/dist/vue.js"></script> 
<link rel="stylesheet" href="https://unpkg.com/bootstrap@4.0.0/dist/css/bootstrap.css"> 
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> 
 
<div id="app"> 
  <table class="table table-striped"> 
    <thead> 
      <tr> 
        <th scope="col">id</th> 
        <th scope="col">Логин</th> 
        <th scope="col">Действие</th> 
      </tr> 
    </thead> 
    <tbody> 
      <tr v-for="user in users"> 
        <td v-text="user.id"></td> 
        <td v-text="user.Name"></td> 
        <td> 
          <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModalLong" @click="setDeleteUser(user.id)">Удалить</button> 
        </td> 
      </tr> 
    </tbody> 
  </table> 
  <!-- Modal --> 
  <div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true"> 
    <div class="modal-dialog" role="document"> 
      <div class="modal-content"> 
        <div class="modal-header"> 
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
            <span aria-hidden="true">&times;</span> 
          </button> 
        </div> 
        <div class="modal-body"> 
          Точно удалить? 
        </div> 
        <div class="modal-footer"> 
          <button type="button" class="btn btn-danger" @click="deleteUser()">Удалить</button> 
        </div> 
      </div> 
    </div> 
  </div> 
</div>