VueRouter 实例

分析下列代码

javascript 复制代码
const router = new VueRouter({
    mode:'history',
    routes
})
复制代码
1.const router = new VueRouter({ ... })
 用来创建一个 Vue Router 实例,用于管理 Vue.js 应用的路由。

2.mode: 'history':
作用: 启用 HTML5 History 模式,去除 URL 中的 # 符号(默认是 Hash 模式,如 http://example.com/#/home)。
效果: URL 更简洁(如 http://example.com/home)。
**注意:**需服务器配置(如 Nginx、Apache)支持,确保直接访问子路径时返回 index.html,否则会出现 404 错误。

3.routes:

作用:定义路由规则数组,每个路由映射到对应的 Vue 组件。

javascript 复制代码
const routes = [
  { path: '/', component: Home },
  { path: '/about', component: About }
];
相关推荐
凌晨一点的程序员1 小时前
antd中的表格穿梭框(Transfer)如何使用
前端·javascript·html·react·antd·transfer
^小桃冰茶2 小时前
HTML 从标签到动态效果的基础
前端·html
火柴盒zhang2 小时前
基于HTML CANVAS和EXCEL的xlsx文件展示工具websheet
前端·javascript·html·spreadsheet·websheet
一城烟雨_6 小时前
vue3 实现将html内容导出为图片、pdf和word
前端·javascript·vue.js·pdf
树懒的梦想7 小时前
调整vscode的插件安装位置
前端·cursor
低代码布道师8 小时前
第二部分:网页的妆容 —— CSS(下)
前端·css
一纸忘忧8 小时前
成立一周年!开源的本土化中文文档知识库
前端·javascript·github
涵信9 小时前
第九节:性能优化高频题-首屏加载优化策略
前端·vue.js·性能优化
前端小巷子9 小时前
CSS单位完全指南
前端·css
SunTecTec9 小时前
Flink Docker Application Mode 命令解析 - 修改命令以启用 Web UI
大数据·前端·docker·flink