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 }
];
相关推荐
Mintopia16 小时前
前端卡顿的真相:不是你代码慢,是你阻塞了
前端
kyriewen16 小时前
可选链 `?.`——再也不用写一长串 `&&` 了!
前端·javascript·ecmascript 6
Mintopia16 小时前
别再乱加缓存:一套判断"该不该缓存"的方法
前端
AnalogElectronic16 小时前
html+js+css实现七龙珠神龙召唤特效
javascript·css·html
Leisureconfused16 小时前
【记录】Node版本兼容性问题及解决
前端·vue.js·npm·node.js
Highcharts.js16 小时前
React 应用中的图表选择:Highcharts vs Apache ECharts 深度对比
前端·javascript·react.js·echarts·highcharts·可视化图表·企业级图表
腹黑天蝎座16 小时前
如何实现自定义的虚拟列表
前端·react.js
用户3501448179216 小时前
继承和原型链:js如何实现继承
前端
Bernard021516 小时前
给普通人的 AI 黑话翻译手册:一文看懂 LLM、RAG、Agent 到底是什么
前端·后端