使用Vue路由器时Laravel路由不起作用

时间:2019-11-29 20:16:34

标签: javascript laravel vue.js vue-router

我正在尝试调用laravel路由Route::get('/logout', 'Auth\LoginController@logout');,该路由将注销用户并重定向到登录页面,但是当我尝试重定向到此url时,它将无法正常工作,就像以前那样调用vue路由器路由,但是该路由在我的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
    }]
})

我的/logout中没有route.js路线,所以为什么不叫我的laravel路线?

4 个答案:

答案 0 :(得分:1)

如何使用router-linkhref在vue组件内生成链接?

  • 如果您要呼叫Vue路线,请使用router-link;
  • 如果您要呼叫“普通”或laravel路线,请使用href;

让我知道它是否有效。

答案 1 :(得分:0)

尝试放置您的Vue路线 在此行之前:-

Auth::routes();

答案 2 :(得分:0)

首先,将Laravel身份验证路由添加到路由文件夹中的web.php文件

Auth::routes();

然后在前端向注销路由发送请求

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

答案 3 :(得分:0)

我在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()
        }
    }
}