vue-router模式使用区别

Vue-router是Vue.js官方提供的路由管理器，通过它可以实现前端页面的路由控制，使得页面之间切换变得更加流畅并且方便。目前Vue-router支持三种不同的路由模式，它们分别是：hash模式、history模式和abstract模式。

1. hash模式：

这是默认的路由模式，在URL路径中#前面的部分称为根路径，后面的部分是hash部分，浏览器不会向服务器发送请求，所以更加安全，并且不需要特殊的服务端配置。这种模式主要是适用于一些不需要SEO优化的单页应用。

2. history模式：

这种模式时URL中不含有#号的，如果用户手动改变了URL，浏览器将向服务器发送请求。需要在服务端进行一些配置，否则会导致用户直接访问到不存在的页面，出现404错误。使用history模式对SEO更加友好，可以在搜索引擎中被正确的收录。

3. abstract模式：

这种模式并不依赖于浏览器的URL，也不需要服务端进行特殊的配置，通常被用来在非浏览器环境下使用，例如在Weex中使用Vue-router时就需要使用abstract模式。

总之，不同的路由模式适用于不同的场景，我们需要根据实际的项目需求来选择合适的路由模式。

相关问题

vue-router3和vue-router4底层分别是什么事件

Vue Router 3 和 Vue Router 4 的底层实现都是基于浏览器的 History API，主要使用了以下事件：

- pushState()：向浏览器会话历史栈添加一个新的状态；
- replaceState()：用新的状态替换当前的状态；
- popstate 事件：当用户点击浏览器的前进或后退按钮时触发，用于监听浏览器的历史栈变化。

不同之处在于 Vue Router 4 引入了一个新的可选的路由模式 - hash 模式，它使用浏览器的 URL 锚点来实现路由。在 hash 模式下，路由器使用以下事件：

- onhashchange 事件：当 URL 的哈希部分发生变化时触发，用于监听 URL 哈希的变化。

需要注意的是，Vue Router 4 仍然支持 History API，并且在默认情况下会将路由模式设置为 history 模式。

vue-router的模式

vue-router有三种模式：

1. hash模式：使用URL的hash值来模拟一个完整的URL，使用`location.hash`来监听URL的变化。

2. history模式：使用HTML5的History API来实现URL的变化，使用`window.history.pushState()`和`window.history.replaceState()`来监听URL的变化。

3. abstract模式：不依赖于浏览器的URL，常见于服务器渲染的情况下，通过修改内存中的URL来实现路由的变化。