[英]Laravel and Vuejs axios delete gives no error but doesnt delete
I created a web route that must delete a contact based on a specific id and it looks like this: 我创建了一个Web路由,该路由必须基于特定的ID删除联系人,如下所示:
Route::delete('/api/deleteContact/{id}', 'ContactController@destroy');
Then inside the controller, I have the following: 然后在控制器内部,我有以下内容:
public function destroy($id)
{
// delete a contact by id
return response()->json(Contact::whereId($id), 200);
}
Inside one of my blade template files, I call the Vue component which displays the list of contacts: 在我的刀片模板文件之一中,我调用了显示联系人列表的Vue组件:
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Name</th>
<th scope="col">Phone</th>
</tr>
</thead>
<tbody>
<tr v-for="contact in contacts">
<td> {{ contact.id }} </td>
<td> {{ contact.name }} </td>
<td> {{ contact.phone }} </td>
<td><button class="btn btn-secondary">Edit</button></td>
<td><button @click="deleteContact(contact.id)" class="btn btn-danger">Delete</button></td>
</tr>
</tbody>
</table>
The delete button calls the deleteContact method and received the contact id in question. 删除按钮调用deleteContact方法,并接收到相关的联系人ID。
The method looks like this: 该方法如下所示:
deleteContact(id){
axios.delete('/api/deleteContact/' + id)
.then(res => {
for(var i = 0; i < this.contacts.length; i++) {
if(this.contacts[i].id == id) {
this.contacts.splice(i, 1);
}
}
})
.catch(err => console.log(err));
}
When I click to delete, the promise(then) occurs, however, after refreshing the page, I noticed that nothing was deleted and I see no errors in the console. 当我单击删除时,将出现诺言(然后),但是,刷新页面后,我注意到没有删除任何内容,并且在控制台中看不到任何错误。
How can I successfully delete the contact based on the id passed in the deleteContact function ? 如何基于deleteContact函数中传递的ID成功删除联系人?
You have to append delete at the end of query like this: 您必须在查询末尾添加delete,如下所示:
public function destroy($id)
{
// delete a contact by id
return response()->json(Contact::where('id',$id)->delete(), 200);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.