vuerouter三种模式及总结

最新推荐文章于 2023-10-20 17:25:43 发布

___chu

最新推荐文章于 2023-10-20 17:25:43 发布

阅读量331

点赞数

分类专栏：【Vue】文章标签： vue.js

本文链接：https://blog.csdn.net/zxl1173558248/article/details/127405020

版权

【Vue】专栏收录该内容

20 篇文章 1 订阅

订阅专栏

一、使用

vue2.x语法

const router = new VueRouter({
    // mode: 'history',
    linkActiveClass: 'nav-active',
    base: publicPath ? `/${publicPath}/` : '',
    routes
});

vue3.x语法

const router = createRouter({
  history: createWebHistory(__DEV__ ? '/' : '/hyth5/'),
  routes,
  scrollBehavior(to, from, savedPosition) {
    return { x: 0, y: 0 };
  }
});

二、模式

三种模式，默认是Hash模式，history模式，abstract模式，vue2直接如上设置mode就行，vue3的话如上配置不同的RouterHistory

Hash模式路径带有Hash也就是例如：#main；

history模式没有；

abstract模式可以用于同链接的页面嵌套；举个栗子