在Vue.js中，vue-router是一个非常重要的路由库，它允许我们在单页面应用中管理导航，通过这个库我们可以轻松构建单页面应用。vue-router支持两种路由模式：hash模式和history模式。
hash模式的核心就在于URL中的“#”符号。在hash模式下，当URL发生变化时，页面并没有重新加载，而是触发onhashchange事件。例如，当我们点击链接切换页面时，实际上是改变了URL中的hash值，然后触发路由器中设置好的事件来渲染页面。
hash模式的优点是兼容性好，不需要服务器支持，可以直接通过静态文件访问，不用担心404错误。同时，hash模式也可以用来解决单页面应用中前进后退的问题，我们可以通过监听onhashchange事件来实现。
示例：
//router配置
const router = new VueRouter({
mode: 'hash', //路由模式为hash模式
routes: [
{
path: '/home',
name: 'Home',
component: Home
},
{
path: '/about',
name: 'About',
component: About
}
]
})
history模式则是将URL中的路径部分作为状态保存下来。在history模式下，当URL发生变化时，页面会重新加载，但是不会向服务器发送请求，而是直接解析浏览器缓存中的文件。
history模式需要后端服务器进行支持，需要后端服务器配置文件来匹配任意的路由，否则服务器会返回404错误。同时，history模式还可以通过History API来进行前进、后退操作。
示例：
//router配置
const router = new VueRouter({
mode: 'history', //路由模式为history模式
routes: [
{
path: '/home',
name: 'Home',
component: Home
},
{
path: '/about',
name: 'About',
component: About
}
]
})
//后端服务器配置
//将所有路径都返回index.html文件
app.get('*', function(req, res){
res.sendFile(__dirname + '/public/index.html');
});
总的来说，hash模式和history模式各有优缺点，根据实际需求来选择。
参考文献：
本文链接：http://task.lmcjl.com/news/11331.html