如何在 vue 模板中引用 laravel csrf 字段

我有一个包含表单的 vue 模板：

<form id="logout-form" :action="href" method="POST" style="display: none;">
        {{ csrf_field() }}
</form>

在 Laravel 中，表单必须定义一个 csrf_field() 。但在 vue 组件中，声明{{ csrf_field() }}意味着我有一个名为csrf_field在我的 vue 实例中，我正在调用它。

这种情况下如何添加csrf_field？

如果您的标头（视图）的元标记中有令牌

<meta name="csrf-token" content="{{ csrf_token() }}">

您可以使用访问令牌

data() {
    return {
        csrf: document.querySelector('meta[name="csrf-token"]').getAttribute('content')
    }
}

并在表单中添加一个隐藏的输入字段，并将 csrf 属性绑定到值，如下所示：

<form id="logout-form" :action="href" method="POST" style="display: none;">
    <input type="hidden" name="_token" :value="csrf">
</form>