vue router的hash和history
时间: 2023-04-22 16:06:20 浏览: 123
Vue Router的hash和history是两种不同的路由模式。
hash模式是指在URL中使用#符号来表示路由,例如:http://example.com/#/home。在hash模式下,路由的变化不会导致浏览器向服务器发送请求,因此可以实现单页应用的路由。
history模式是指在URL中不使用#符号来表示路由,例如:http://example.com/home。在history模式下,路由的变化会导致浏览器向服务器发送请求,因此需要服务器端的支持。
在Vue Router中,默认使用hash模式,可以通过设置mode属性来切换到history模式。两种模式各有优缺点,具体选择哪种模式需要根据实际情况来决定。
相关问题
vue router hash 和 history
Vue Router 提供了两种路由模式:hash 模式和 history 模式。
1. Hash 模式:
在 hash 模式下,URL 中的路由会以 "#/" 开头,例如:http://example.com/#/home。这种模式下,路由的改变不会导致页面的刷新,而是通过监听 URL 的 hash 值变化来实现路由切换。Vue Router 默认使用的就是 hash 模式。
2. History 模式:
在 history 模式下,URL 中的路由不再带有 "#/",例如:http://example.com/home。这种模式下,路由的改变不会有 "#" 符号出现在 URL 中,看起来更加美观。但是需要注意的是,history 模式需要服务器端的支持,因为在 history 模式下刷新页面或直接访问某个 URL 时,会向服务器发送请求,所以需要配置服务器以返回正确的页面。
你可以通过以下方式配置 Vue Router 的路由模式:
```javascript
import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router';
const router = createRouter({
history: createWebHashHistory(), // 使用 hash 模式
// history: createWebHistory(), // 使用 history 模式
routes: [
// 路由配置
],
});
```
其中,`createWebHashHistory()` 创建 hash 模式的路由实例,`createWebHistory()` 则创建 history 模式的路由实例。根据需要选择相应的模式进行配置。
vue-router中的hash和history
vue-router中的hash模式和history模式是两种不同的路由模式。
hash模式会在URL中添加一个#号,例如http://example.com/#/about。这种模式在不支持HTML5 History API的浏览器中可以正常工作。
history模式会把URL变成真实的路径,例如http://example.com/about。这种模式需要服务端的配合,因为所有的路由请求都会被代理到同一个HTML文件上。
默认情况下,vue-router使用hash模式。但可以通过配置来改变它的行为。
阅读全文