удаление данных из базы данных, «метод GET не поддерживается»

Question

Попытка удалить данные из базы данных, и вот как я использую контроллер и маршрут для этого:

контроллер

public function articleDelete($id)
{

    return $article = Article::destroy($id);

    // return response()->json([
    //     "article" => $article,
    //     "message" => "Deleted Successfully"
    // ]);

}

API

Route::group(['prefix' => 'v1'], function(){
    /* fetch */
    Route::get("/articles", "Api\ArticlesController@allArticles");
    Route::get("/articles/{id}", "Api\ArticlesController@singleArticle");

    /* add new & delete */
    Route::post("articles/add", "Api\ArticlesController@newArticle");
    Route::delete("articles/delete/{id}", "Api\ArticlesController@articleDelete");
});

, и это мой метод в vue компоненты :

methods: {
    deleteArticle(article, id){
        axios.delete("api/v1/articles/delete/" + article.id).then(response => {
            let index = this.articles.indexOf(article);
            this.articles.splice(index,1);
            console.log(response.data);
        })
    },
}

, когда я добавляю новую статью, там нет проблем.Но когда я пытаюсь удалить статью, появляются ошибки.Сначала в консоли, id не определен, это .../api/v1/articles/delete/undefined

, и это ошибка.

Метод GET не поддерживается для этого маршрута.Поддерживаемые методы: POST.

Я уже использую post для маршрута, поэтому он продолжает говорить, что метод get не поддерживается.Я не использую get для маршрута.И я очистил route: clear и проверил, нет проблем с маршрутом на пост.

Что мне здесь не хватает?Спасибо.

Дополнительно Я даю ключевую опору, когда зацикливаю данные.

<tr :key="item.id" v-for="(item, index) in fetchArticle">
    <td>{{item.entry}}</td>
    <td>{{item.company_name}}</td>
    <td><button type="button" class="btn btn-danger" @click="deleteArticle(item.id)" :id="item.id">delete</button></td>
</tr>

Я не понимаю, почему идентификационная часть не определена.

Answer 1

Я решил проблему.Это немного моя ошибка, хотя.

Я изменил сообщение о маршруте, чтобы удалить

Route::delete("articles/delete/{id}", "Api\ArticlesController@articleDelete");

И в компоненте vue произошли некоторые изменения.

deleteArticle(id){
     axios.delete("api/v1/articles/delete/" + id).then(response => {
        let index = this.articles.indexOf(id);
        this.articles.splice(index,1);
        console.log(response.data);
     })
},

также кнопка события, которую я изменил, как показано ниже.

<td><button type="button" class="btn btn-danger" @click="deleteArticle(item.id)" :id="item.id">delete</button></td>

Надеюсь, это поможет и другим ...

Answer 2

//change route code
Route::delete("articles/delete/{id}", "Api\ArticlesController@articleDelete");
//change vue code
axios.delete("api/v1/articles/delete/" + article.id).then(response => {

Я новичок, вы можете попробовать мой метод, надеюсь, я смогу вам помочь.