资源路由调用Vue组件中的错误方法

Question

我已经用“资源”创建了路线。当我尝试使用删除方法时，它总是会显示方法。

-路由调用(在Vue组件中)

<a class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text green-800"v-bind:href="'translate-breed/' + breedDetail.id">Delete
</a>

路线列表

-删除方法

public function destroy(TranslateBreed $translateBreed)
    {
        $translateBreed->delete();
        session()->flash('flash_message', 'The Breed has been deleted.');
        return redirect()->route('translate-breed.index');
    }

当我使用 php blade 文件时，出现了这个问题，在这种情况下，我按如下方式处理它，

<form method="POST" class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-green-800" action="{{ route('translate-breed.destroy',['translate_breed' => $breed->id]) }}">
 @csrf
 @method("delete")
<button class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-green-800">
Delete
</button>
</form>

如何解决这个问题。

谢谢！

Answer 1

您应该在 Vue 组件中使用像 Axios 这样的库，它允许您在每个请求上设置方法。在您的组件中创建一个使用它的方法。

从您的 link:

<a href="" @click.prevent="deleteTranslate(breedDetail.id)">Delete</a>

创建调用 Axios 的方法：

 deleteTranslate(id) {
            axios
                .delete("translate-breed/" + id)
                .then(response => {
                //Do something
                });
        },

不要忘记在您的项目中包含 axios 依赖项。

资源路由调用Vue组件中的错误方法

Resource route call to wrong method in Vue component

php

laravel

vue-component