Laravel 5.7与VUE路由器模式

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (611)

我在开发阶段有一个应用程序,我尝试添加Vuejs。现在我想删除URL中的哈希#。在vue-router实例中,我添加了路由并尝试添加

<code>mode:history</code>

但它不起作用。关于如何解决这个问题的任何想法?谢谢

这是我的路线

require('./bootstrap');

window.Vue = require('vue');

import VueRouter from 'vue-router'
import Appearance from './components/Appearance/Appearance.vue'
Vue.use(VueRouter)

let routes =  [
    {path: '/appearance', component: Appearance}
]

const router = new VueRouter([
    routes

])


Vue.component('Sidebar', require('./components/_partials/Sidebar.vue'));


const app = new Vue({
   el: '#app',
   router
});
提问于
用户回答回答于

在路由器配置中添加hashbanghistory,它将删除URL中的#

试试这个:

const router = new VueRouter({
  hashbang: false, // Add this line
  history: true, // Add this line
  routes
})
用户回答回答于

在路由配置中,您需要将其更改为:

const router = new VueRouter([
    mode: 'history', // Add this line
    routes
]);

在您的-app-path / routes / web.php中的Web路由中,您需要将其更改为:

Route::get('/{any}', 'AppearanceController@index')->where('any', '.*');

使用这些基本配置,您将能够启用html5历史记录模式。现在,您可以导航到任何页面,甚至可以刷新您所在的页面,您仍然可以使用它。希望它有所帮助。

扫码关注云+社区

领取腾讯云代金券