首页 > 其他分享 >Vue--动态路由

Vue--动态路由

时间:2022-10-28 19:59:22浏览次数:38  
标签:index Vue name -- component test import 路由

router.addRouter的基础用法
静态路由
const routes = [
    {
        path: '/',
        name: 'Login',
        component: () => import(/* webpackChunkName: "about" */ '@/views/Login.vue')
    },
    {
        path: '/index',
        name: 'index',
        meta: { title: '首页', noCache: true },
        component: () => import(/* webpackChunkName: "about" */ '@/views/index.vue'),
        children:[]
        // children: [{
        //     path: '/test',
        //     name: 'test',
        //     component: () => import('../views/test.vue')
        // }
        // ]
    }
]
动态路由
const routeObj = {
    path: 'index/test', // 这里要把父路由的路径也带上
    name: 'test',
    meta: { title: '测试路由test', noCache: true },
    component: () =>
    import('../test/test.vue'),
}
//添加子路由只需把addRoute第一个参数填写父级路由的name
this.$router.addRoute('index', routeObj)

标签:index,Vue,name,--,component,test,import,路由
From: https://www.cnblogs.com/zhouwying/p/16837255.html

相关文章

  • Sass、Scss、Less笔记
    一、Sass和SCSS有什么区别? SCSS是Sass3引入新的语法,其语法完全兼容CSS3,并且继承了Sass的强大功能。Sass和SCSS其实是同一种东西,我们平时都称之为Sass,两者之......
  • 用esp8266向外界发送网络信号
    #include<ESP8266WiFi.h>constchar*ssid="fengzhihean";constchar*password="12345678";voidsetup(){Serial.begin(115200);WiFi.softAP(ssid,password);......
  • Vue--创建项目及自己配置路由
    1).创建项目vuecreatemyapp022).添加一个配置文件vue.config.jsmodule.exports={lintOnSave:false,devServer:{port:8080}}3).启动项目yarns......
  • yum代理设置
    当我们在安装/调试/升级服务器时,没有外网怎么办呢?这时可以设置yum代理来安装软件包。 vi/etc/yum.conf加入以下:proxy=http://代理服务器ip:port如果代理需要账号密......
  • Vue--Tab栏切换(父子组件间传值实现)
    一、实现原理:子组件配置props属性接受父组件传来的index值,top子组件采用this.$emit方法传index值给父组件二、HTML代码:<divclass="box"><my-top@xxx="fnChange">......
  • MongoDB--常用语句
    1、插入单条数据db.students.insertOne({name:'Jane',age:21})2、插入多条数据db.students.insertMany([{name:'Kang',age:22},{name:'Mike',age:19}])3、删除单条数......
  • MySQL--常用语句
    MySQL常用语句1、获取数据库信息1.use数据库名;//选择要操作的Mysql数据库,使用该命令后所有Mysql命令都只针对该数据库。2.showdatabases;//列出MySQL数据库管理......
  • JavaScript--字符串
    一、字符串的概述1、String(字符串)数据类型表示零或多个16位Unicode字符序列。字符串可以使用双引号(")、单引号(')或反引号(`)标示。2、ECMAScript中的字符串是不可变的(im......
  • JavaScript--正则表达式
    一、概述正则表达式(RegularExpression)是一个描述字符模式的对象,用于对字符串进行匹配,一般用在有规律的字符串匹配中;常用于表单验证以及相关的字符串匹配二、声明......
  • JavavScript--ES5和ES6(下)
    一、Map基于set和array之上构建的一个集合1、Map的声明使用new关键字和Map构造函数letm=newMap();通过二维数组声明vararr=[[1,2],[3,4]]varmap=ne......