router-view 属性介绍_可缺不可滥的博客-程序员宝宝_router-view 属性

技术标签: router-view  前端 vue-router  name  vue-router  

1 name属性

<router-link to="/radio">radio</router-link>
<router-view name="radio1"></router-view>
<router-view name="radio2"></router-view>

name属性用来渲染特定组件

在路由的js中必须进行相应的配置,才能生效

const router = new Router ({
    
routes: [
  {
    
   	path: '/radio',
   	name: 'Radio',
   	components: {
    
   		default: Radio,
   		radio1: Radio1,
   		radio2: Radio2
   	}
  }
]
})

根据以上的配置,当radio路由被激活的时候,

<router-view name="radio1"></router-view>
<router-view name="radio2"></router-view>

上面两个标签将会分别渲染Radio1和Radio2这两个组件
当路由router没有被激活的时候,这两个标签就不会生效

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/glorydx/article/details/102985020

智能推荐

软件工程导论期末复习_teree_的博客-程序员宝宝

软件工程必考题预测及整理目录文章目录软件工程必考题预测及整理目录名词解释与简答工具的应用(怎么用及用法)结构图N-S图(盒图)判定树判定表Jackson图分析题:需求分析——&gt;数据流程图(DFD)——&gt;软件结构图DFD图(数据流程图)中心变换型事务处理型系统结构图变换分析技术事务分析技术例题测试白盒测试逻辑覆盖黑盒测试等价类法边值分析法面向对象的对象模型状态转换图问题状态转换图对象模型补充软件生命周期及5种模型可行性研究数据流图需求分析的图耦合性与内聚性启发规则(作用范围及控制范围)详细设计

oracle 常用命令_renfengjun的博客-程序员宝宝

出自Oracle.Press.Portable.DBA.Oracle.Essential.Techniques.for.the.Day-to-Day.DBAalter clusterALTER CLUSTER pub_cluster SIZE 4K; ALTER CLUSTER pub_cluster DEALLOCATE UNUSED KEEP 1M;alter d

HM2805B高效率恒流限流 WLED 驱动IC_深圳市泛海微电子有限公司的博客-程序员宝宝

产品简介泛海微HM2805B是一种输入电压范围宽(0.8~5.5V),可调恒定电流和限定电流两种模式来 驱动白光 LED 而设计的升压型 DC/DC 变换器。采用变频模式,逐周期限流,使输入输 出电流随电源电压降低均匀变化。该器件能利用单节或双节干电池驱动单颗大功率白光 LED,同样可以利用一节锂电池驱动两颗、三颗或多颗 WLED。驱动 WLED 串联连接 的方法可以提供相等的 WLED 电流,从而获得均匀的亮度。 46mV 的低反馈电压最大限度地降低了电流调节电阻器的功耗,从而提高了效率。 50mV

[机器学习必知必会]正则化和范数_TOMOCAT的博客-程序员宝宝

写在前头本文格式略微有些乱码,为不妨碍阅读,可以查看我在头条上写的原文:https://www.toutiao.com/i6650364324176986637/正则化综述机器学习中经常会在损失函数中加入正则项,称之为正则化(Regularize)。目的:防止模型过拟合原理:在损失函数上加上某些规则(限制),缩小解空间,从而减少求出过拟合解的可能性例子:以最简单的线...

6.HTML基础知识-表格_白山茶ι的博客-程序员宝宝

HTML制作表格的基本知识1.表格的基本属性&lt;table&gt;定义一个表格&lt;caption&gt;表格标题&lt;/caption&gt; &lt;tr&gt;第一行 &lt;td&gt;第一行第一列单元格内容&lt;/td&gt; &lt;td&gt;第一行第二列单元格内容&lt;/td&gt;... &lt;/tr&gt; &lt;tr&gt;...

随便推点

matplotlib绘制柱状图_[小G]的博客-程序员宝宝_matplotlib柱状图横坐标

柱状图plt.bar(x, height, color,edgecolor,width=0.8,align='center',bottom=None)必选参数:x,表示横坐标刻度值,可以是array、list等height,表示每个柱子的高度,可以是array、list等可选参数:color:每个柱子的颜色,如果所有柱子的颜色都一样,可以只设置一种颜色,如color='blue';但如果每个柱子都想要不同的颜色,用列表表示每个柱子的颜色。例如:#假设有三个柱子x = [1,2,3]

BZOJ 2744 [HEOI 2012] 二分图最大独立集 解题报告_onepointo的博客-程序员宝宝

2744: [HEOI2012]朋友圈Description在很久很久以前,曾经有两个国家和睦相处,无忧无虑的生活着。一年一度的评比大会开始了,作为和平的两国,一个朋友圈数量最多的永远都是最值得他人的尊敬,所以现在就是需要你求朋友圈的最大数目。 两个国家看成是AB两国,现在是两个国家的描述: 1.A国:每个人都有一个友善值,当两个A国人的友善值a、b,如果a xor b mod 2=1, 那么

升级到IE6之后在后面补上的不是com而是co.cn--解决方法 (转)_ciya3282的博客-程序员宝宝

升级到IE6之后在后面补上的不是com而是co.cn--解决方法 (转)[@[email protected]]我们知道在IE中可以通过按下ALT+ENTER组合键在所输入的内容前补上www,在后面补上com,可是在升级到IE6之后在后面补上的不是...

操作系统笔记第五章【虚拟存储器】_Xiao菜瓜的博客-程序员宝宝_常规存储器管理方式具有哪两大特征

虚拟存储器虚拟存储器作为现代操作系统中存储器管理的一项重要技术,实现了对内存的扩充功能。该功能并非物理上实际扩大内存的容量,而是从逻辑上实现对内存容量的扩充,让用户感觉到内存容量比实际容量大得多。虚拟存储器概述将作业一次性装入内存会出现两种情况:1. 有的作业很大,作业不能全部被装入内存。2. 由大量作业要求运行,但是内存不足以容纳所有作业。常规存储管理方式的特征和局部性原理常...

【CDB】Oracle CDB/PDB常用管理命令_qq_17299953的博客-程序员宝宝_cdb read

Oracle 12C及以上版本 CDB/PDB常用管理命令1. 查看PDB信息SQL&gt; show pdbs --查看所有pdb CON_ID CON_NAME OPEN MODE RESTRICTED---------- ------------------------------ ---------- ---------- 2 PDB$SEED READ ONLY NO