使用 laravel 和 vue js 删除记录答案

【问题标题】：Deleting record using laravel and vue js使用 laravel 和 vue js 删除记录
【发布时间】：2017-02-25 07:45:22
【问题描述】：

我一直在使用 vue js 和 laravel 制作删除方法。我尝试使用 laravel 资源向href 属性添加一个值，并将id 作为第二个参数传递，但是当我单击它并在控制台上显示 id 时，它对所有不正确的数据显示相同的 id。

样品刀片：

<a id="deleteRecord" data-id="{{$project->id}}" @click.prevent="deleteRecord" class="btn btn-circle btn-icon-only btn-danger" href="{{ route('projects.store', $project->id) }}">
   <i class="icon-trash"></i>
</a>

Vue方法：

deleteRecord: function(id) {
  var dataId = $('#deleteRecord').attr('href')
  console.log(dataId);
}

【问题讨论】：

Laravel 资源仅使用DELETE 方法删除。您必须使用axios 并发送DELETE 查询。
@EddyTheDove，是的，但我知道这可以使用 vue 完成并显示一些很酷的确认模式或类似的东西。
当然。 axios 存在于您的 Vue 方法中。好的，它不一定是 axios。任何http客户端都可以。
@EddyTheDove，我会试试的

标签： laravel vue.js laravel-5.3

【解决方案1】：

在你的方法 deleteRecord 内部：

this.$http.delete(url)
.success(function(response) {
    console.log(response)
}) 
.error(function(errors) {
    console.log(error)
});

或者在你的方法中使用 axios

axios.delete(url)
.then(function (response) {
    console.log(response);
})
.catch(function (error) {
    console.log(error);
});

【讨论】：

您必须手动添加带有npm install --save axios 的 axios 并在您的 Vuejs 中使用它。 axios 是一个 JS 库。
第一种方法你试过了吗？ this.$http.delete(url, {'method': 'DELETE' });
是的，没有axios，但说Cannot read property 'delete' of undefined
好的。看看这里。他完全按照我所说的使用this.$http.delete()felicianoprochera.com/…。只需向下滚动页面，您就会看到它是如何使用它的。

【解决方案2】：

我现在明白了。我只是在这里发布它以帮助其他人。

deleteRecord: function(id) {
  var url = "projects" + "/" + id;
  $.ajax({
      url: url,
      type: 'DELETE',
      data: { "_token": "{{ csrf_token() }}" },
      success: function(response) {
          //do some success stuff here..
      }
  });
}

【讨论】：