Удалить запись JSON в VUE

<script>
import './styling.scss'
export default {
  name: "app",
  data() {
    return {
      items: {books:[], authors:[]}
    };
  },

  created: function() {
    this.makeAjaxCall("books.json", "get").then(res => {
        this.items.books = res.books;
        return res;
    }),

    this.makeAjaxCall("authors.json", "get").then(res => {
        this.items.authors = res.authors;
        return res;
    })
  },

  },

  methods: {
    removeEntry:function(item) {
        this.$delete(this.items.books, item.name);
      },

    makeAjaxCall:function(url, methodType){
      var promiseObj = new Promise(function(resolve, reject){
          var xhr = new XMLHttpRequest();
          xhr.open(methodType, url, true);
          xhr.send();
          xhr.onreadystatechange = function(){
          if (xhr.readyState === 4){
            if (xhr.status === 200){
                //alert("xhr done ok");
                var response = xhr.responseText;
                var respJson = JSON.parse(response);
                resolve(respJson);
            } else {
                reject(xhr.status);
               //alert("xhr failed");
            }
          } else {
            //alert("xhr processing");
          }
      }
      //alert("request sent succesfully");
    });
    return promiseObj;
    }
  }
};
</script>

<template>
  <div id = "app">
    {{items.authors}}
    <table class = "booksTable">
      <thead>
        <tr>
          <th>Title</th>
          <th>Author</th>
          <th>Genre</th>
          <th>Image</th>
          <th>Availability</th>
          <th>Options</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for = "item in items.books" :key = "item.name">
              <td>{{item.name}}</td>
              <td>{{item.author}}</td>
              <td>{{item.genre}}</td>
              <td><img id = "imageBook" :src = "item.imageUrl"></td>
              <td v-if = "item.availability">Available</td>
              <td v-else>Unavailable</td>
              <td>
                <button class = "btn add">Add</button>
                <button class = "btn edit">Edit</button>
                <button class = "btn delete" v-on:click = "removeEntry(item)">Delete</button>
              </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>