vue2 如何配置路由详解。

首先我们要安装一下vue-router,命令为 yarn add vue-router@3.5.3 或者使用 npm 命令。

有人在配置路由的时候可能会报以下错误:如何解决呢,就是版本号太高了(4版本),用以上的命令就可以(yarn add vue-router@3.5.3 )。

Cannot read properties of undefined (reading ‘install‘)

1.首先导入Vue 和 我们要使用的vue-router包。

2.注册

3.创建实例

4.在routes数组中配置路由。每一个对象一个页面,如果配置二级页面就在该对象下面配置children

5.导出router

import Vue from "vue";    

import VueRouter from 'vue-router'

Vue.use(VueRouter)

const router = new VueRouter({

    routes:[

        { path: '/',

         component: () => import('../Layout/LayoutIndex.vue'),

         redirect: '/HandelLogin',

        children: [{

            path: 'HandelLogin',

            name: 'HandelLogin',

            component: () => import('../views/HandelLogin.vue'),

            meta: { title: 'dl', icon: 'dashboard' },

          }]

    }

    ]

})

export default router

 6.在main.js中导入router 挂载到全局

相关推荐

  1. Vue如何创建一个新页面以及相关配置详解

    2024-01-18 17:54:06       52 阅读
  2. vue-详解

    2024-01-18 17:54:06       39 阅读
  3. React如何配置

    2024-01-18 17:54:06       27 阅读
  4. Vue2 动态

    2024-01-18 17:54:06       32 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-01-18 17:54:06       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-01-18 17:54:06       100 阅读
  3. 在Django里面运行非项目文件

    2024-01-18 17:54:06       82 阅读
  4. Python语言-面向对象

    2024-01-18 17:54:06       91 阅读

热门阅读

  1. Easypoi word 模板导出问题

    2024-01-18 17:54:06       56 阅读
  2. Django密码修改和重置视图

    2024-01-18 17:54:06       61 阅读
  3. K8s面试题——情景篇

    2024-01-18 17:54:06       68 阅读
  4. C++ 提高编程篇2:STL初识

    2024-01-18 17:54:06       49 阅读
  5. HTML 入门级知识点总结

    2024-01-18 17:54:06       48 阅读
  6. 达梦报错:无效IP,设置达梦访问IP白名单

    2024-01-18 17:54:06       53 阅读
  7. 程序员的能力-如何成为不会过时的“码农”

    2024-01-18 17:54:06       53 阅读
  8. 【Flutter】dart构造函数、工厂构造函数

    2024-01-18 17:54:06       54 阅读
  9. 编程笔记 html5&css&js 038 CSS背景

    2024-01-18 17:54:06       53 阅读