使用 Vue Router 時 Laravel 路由不起作用

Question

我正在嘗試調用 Laravel 路由Route::get('/logout', 'Auth\\LoginController@logout'); 這將注銷用戶並重定向到登錄頁面，但是當我嘗試重定向到這個 url 時它不起作用，任何事情都會發生，就像它在調用 vue 路由器路由一樣，但這條路由在我的router.js中不存在router.js 。

這是我對 vue 路由的路由配置：

Route::get('/{vue_capture?}', function () {
    return view('index');
})->where('vue_capture', '^(?!storage).*$');

這是我的router.js ：

//import ...

Vue.use(Router)

export default new Router({
    mode: 'history',
    routes: [{
        path: '/',
        component: Inicio
    }, {
        path: '/viagens/cadastrar',
        component: Cadastrar
    }, {
        path: '/viagens/listar',
        component: Listar
    }]
})

我的route.js沒有/logout路由，那么為什么它不調用我的 laravel 路由？

Answer 1

您如何在 vue 組件中生成鏈接：使用router-link或href ？

• 如果要調用 vue 路由，請使用router-link ；
• 如果要調用“普通”或 Laravel 路由，請使用href ；

讓我知道它是否有效。

Answer 2

嘗試將您的 vue 路線放在此行之前：-

Auth::routes();

Answer 3

首先，將 Laravel auth 路由添加到路由文件夾中的 web.php 文件中

Auth::routes();

然后在前端發送請求注銷路由

  axios.post('/logout').then(response => {
                location.reload();
            }).catch((error) => {
               console.log(error);
            });

Answer 4

我在 myproject 中所做的。web.php 中有 Auth::routes()。 它將通過在 AthenticatesUser.php 中調用 ougout 來處理它。請查看這個 php 類。

<template>
<div class="container">
    <button class="btn" @click="logout">logout</button>
    <form id="logout-form" action="/logout" method="POST" style="display: 
none;">
                        <input type="hidden" name="_token" :value="token">
                    </form>
    <router-view></router-view>
</div>
</template>
 <script>
  export default {
  computed: {
        token() {
            let token = document.head.querySelector('meta[name="csrf-token"]');
            return token.content
        }
    },
    methods: {
        logout() {
            document.getElementById('logout-form').submit()
        }
    }
}