vue路由的mode和404页面的构建

最新推荐文章于 2024-09-04 16:47:08 发布

随风小薇

最新推荐文章于 2024-09-04 16:47:08 发布

阅读量804

点赞数

分类专栏： vue 工作知识总结文章标签： vue-router的mode模式 404的设置

本文为博主原创文章，未经博主允许不得转载

本文链接：https://blog.csdn.net/qq_39197547/article/details/81911614

版权

vue 同时被 2 个专栏收录

34 篇文章 10 订阅 ¥299.90 ¥399.90

订阅专栏

工作知识总结

25 篇文章 1 订阅

订阅专栏

本文介绍了Vue Router的两种模式——history和hash，并重点讨论了history模式在npm run build时的注意事项，强调了需要后台配合。同时，讲解了如何设置404页面，通过在router/index.js中配置path: '*'来捕获所有未匹配的路由，并展示自定义的Error.vue组件，以提供友好的错误提示。

摘要由CSDN通过智能技术生成

路由的属性mode的应用

mode有两个值：

1.history：:当你使用 history 模式时，URL 就像正常的 url，例如 http://localhost：8080/gotu，也好看！

2.hash: :默认’hash’值，但是hash看起来就像无意义的字符排列，例如http://localhost：8080/#/gotu

在router/index.js文件中

export default new Router({
  mode: 'history',//添加mode模式
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: resolve => require(['@/components/HelloWorld'], resolve)
    },
    {
      path: '/page1',
      name: 'Page1',
      component: resolve => require(['@/components/Page1'], resolve)
     }
  ]
})