三种路由模式对比
1. Hash模式(默认)

mode: 'hash'  // 或不设置
// URL格式:https://example.com/#/home

特点:URL中包含 # 符号
原理:基于 hashchange 事件
兼容性:支持所有浏览器


2. History模式

mode: 'history'  // 当前项目使用的模式
// URL格式:https://example.com/home

特点:URL干净,无 # 符号
原理:基于HTML5 History API
兼容性:需要HTML5支持的现代浏览器


3. Abstract模式

mode: 'abstract'
// 用于非浏览器环境,如Node.js服务器

History模式的优势

// 美观的URL
https://www.baidu.com/goods-management         // ✓ 美观
https://www.baidu.com/#/goods-managemen   // ✗ 有#号
 // SEO友好
// 搜索引擎更容易索引History模式的URL

History模式的配置要求

// 前端配置
 const router = new Router({
  mode: 'history',
  routes: [...]
 })

// 后端配置(nginx示例)
 location / {
 try_files $uri $uri/ /index.html;
 }

在项目中的意义
一般企业级应用,使用History模式:
用户体验更好:URL更专业
SEO友好:便于搜索引擎收录
分享友好:分享的链接更简洁

Logo

Agent 垂直技术社区,欢迎活跃、内容共建。

更多推荐