框架篇-Vue面试题2-说说vue-router路由模式

虽互不曾谋面,但希望能和您成为笔尖下的朋友

以读书,技术,生活为主,偶尔撒点鸡汤

不作,不敷衍,意在真诚吐露,用心分享

点击左上方,可关注本刊

标星公众号（ID：itclanCoder）

如果不知道如何操作

点击这里,标星不迷路

vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL改变时，页面不会重新加载

如下所示

http://localhost/#home

如果觉得hash很丑，我们可以用路由的 history 模式，这种模式充分利用 history.pushState API来完成 URL跳转而无须重新加载页面

const router = new VueRouter({
  mode: 'history',
  routes: [...]
})

如下所示

http://localhost/home

配置路由模式:

• hash: 使用 URL hash 值来作路由。支持所有浏览器，包括不支持HTML5 History Api的浏览器。

• history: 依赖 HTML5 History API 和服务器配置。查看 HTML5 History 模式。

• abstract: 支持所有 JavaScript 运行环境，如 Node.js 服务器端。如果发现没有浏览器的 API，路由会自动强制进入这个模式

base为应用的基础路径,例如:整个单页面应用服务在/app/下,那么base就应该设为/app/,当你在HTML5 history模式下使用base选项之后,所有的to属性都不需要写基础路径了

轻记账-简单记账就用轻记账

公众号（ID：itclanCoder）

码能让您早脱菜籍，文能让您洗净铅华

  可能您还想看更多：

小程序-云开发-实现生成小程序码

Js篇-面试题14-JavaScript 中的 window.onload 事件和 jQuery 的 ready 函数有何区别

Js篇-面试题12-如何解析 URL 提取 params 参数

Js篇-面试题11-比较下for..of与for..in的区别

Js篇-面试题9-请说一下Js中的事件循环机制

vuepress建站过程中遇到的一些问题