1.配置路由

const routes = [
{
path: '/User',
component: User,
children: [{ path: 'OP1', component: OP1 },//注意子路由的路径写法这里不加/
{ path: 'OP2', component: OP2 }
]
}
 
]

2.父路由里配置子路由显示的地方<router-view></router-view>

Vue 路由的嵌套的更多相关文章

  1. Vue 路由的嵌套使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. Vue中使用children实现路由的嵌套

    Vue中使用children实现路由的嵌套 相关Html: <!DOCTYPE html> <html lang="en"> <head> &l ...

  3. Vue中路由的嵌套

    import Vue from 'vue'; import App from './App.vue'; //引入公共的scss 注意:创建项目的时候必须用scss import './assets/c ...

  4. Vue路由嵌套

    Vue路由嵌套 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  5. vue 路由嵌套 及 router-view vue-router --》children

    vue 路由嵌套 vue-router -->children   在项目的很多子页面中,我们往往需要在同一个页面做一个组件的切换,同时保存这个页面的部分数据(比如树形菜单),进而显示不同的数据 ...

  6. Vue学习笔记【28】——Vue路由(使用 children 属性实现路由嵌套)

    使用 children 属性实现路由嵌套   <div id="app">    <router-link to="/account"> ...

  7. vue.js_11_路由的2中参数传递和路由的嵌套

    1.以?的形式传递参数   <router-link to="/login?id=10&name=zs">登录</router-link> 发送参数 ...

  8. vue 路由缓存 路由嵌套 路由守卫 监听物理返回

    最近开发vue项目,遇到的一些问题,这里整合一下,看到一些博客已经有写相关知识,然后自己再次记录一下. 这是关于vue路由相关比较常见的问题,以后遇到相关路由的问题,会不断更新这篇博客. 需求1:从填 ...

  9. vue路由-动态路由和嵌套路由

    一.动态路由 我们经常需要把某种模式匹配到的所有路由,全都映射到同个组件.例如,我们有一个 User 组件,对于所有 ID 各不相同的用户,都要使用这个组件来渲染.那么,我们可以在 vue-route ...

随机推荐

  1. Python学习之路基础篇--09Python基础,初识函数

    函数可以分为内置函数 和 自定义函数.这次关注的主要是自定义函数.定义函数之后,就可以在任何需要它的地方调用. 1 返回值的重要性 返回值的3种情况 没有返回值 ---- 返回None 不定 retu ...

  2. canvas 填充图片

    画一个更骚气的圆 https://juejin.im/post/5781d0495bbb500061fd683d

  3. c——闰年

    PTA #include<stdio.h> int main() { int year,month,day,cnt,flag; flag = ; scanf("%4d/%2d/% ...

  4. mysql 两张表的数据设置主外健关联删除

    image_group 主表 image 副表 alter table image add constraint fk_group_idforeign key (group_id)references ...

  5. spring定时器cron

    关于cron表达式(参考资料):Cron 表达式包括以下 7 个字段: 秒 分 小时 月内日期 月 周内日期 年(可选字段) 特殊字符Cron 触发器利用一系列特殊字符,如下所示: 反斜线(/)字符表 ...

  6. Java成神路上之设计模式系列教程之一

    Java成神路上之设计模式系列教程之一 千锋-Feri 在Java工程师的日常中,是否遇到过如下问题: Java 中什么叫单例设计模式?请用Java 写出线程安全的单例模式? 什么是设计模式?你是否在 ...

  7. Temporary failure in name resolutionf的解决方法

    Linux有时还蛮烦的这个不能用那个不能用,只能多折腾了. 今天又是,ping z.cn的时候直接报错 Temporary failure in name resolutionf 这个一般都知道是DN ...

  8. XSS学习(三)挖掘思路

    HTML标签之间 <div id="body"> [输出点] </div> payload:<script>alert(1)</scrip ...

  9. gtest 三种事件机制

    前言: 1.首先说明gtest中事件的结构层次: 测试程序:一个测试程序只有一个main函数,也可以说是一个可执行程序是一个测试程序.该级别的事件机制会在程序的开始和结束执行. 测试套件:代表一个测试 ...

  10. centos7下安装nginx

    1.yum install epel-release(安装epel(Extra Packages for Enterprise Linux)) 2.yum repolist(确保epel添加到yum的 ...