vue实战开发001:如何去除路径中的 #/

       我们在采用vue-cli 自动构建的vue脚手架开发项目时，前后端分离一般会使用vue-router来配置路由，这时我们会发现在路径中会有#的字段，总感觉很别扭。

http://localhost:8080/#/

其实vue-router有两种模式，hash模式和history模式，带＃的是hash模式，不带#的则是history模式，vue-router默认为hash模式，所以这里我们主要将其改为history模式即可。

history 模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面

http://localhost:8080/

那么怎么来实现呢，很简单，只要将router中的mode设置为history就可以了。

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'

Vue.use(Router)

export default new Router({
  mode:'history',
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    }
  ]
})

 欢迎关注本人的公众号：编程手札，文章也会在公众号更新