iview中嵌套使用tabs注意事项

说明： iview组件中当嵌套使用 Tabs时，需要在Tabs中指定 name 属性来区分层级，然后在TabPane 中设置 tab 属性指向对应 Tabs 的 name 字段。

正确示例：在每一个Tabs中都需要设置name属性，然后在其包含的所有直接TabPane中设置tab属性指向其对应的Tabs的 name 字段。

<Tabs name="tab1" ><TabPane label="标签1" tab="tab1"><Tabs name="tab1-1"><TabPane label="标签1-1" tab="tab1-1">标签1-1的内容</TabPane><TabPane label="标签1-2" tab="tab1-1">标签1-2的内容</TabPane></Tabs></TabPane><TabPane label="标签2" tab="tab1"><Tabs name="tab1-2"><TabPane label="标签2-1" tab="tab1-2">标签2-1的内容</TabPane><TabPane label="标签2-2" tab="tab1-2">标签2-2的内容</TabPane></Tabs></TabPane>
</Tabs>

运行结果：

错误示例：如果不设置 name 或 tab 属性，则会导致标签位置错乱。

<Tabs name="tab1" ><TabPane label="标签1" tab="tab1"><Tabs><TabPane label="标签1-1" tab="tab1-1">标签1-1的内容</TabPane><TabPane label="标签1-2" tab="tab1-1">标签1-2的内容</TabPane></Tabs></TabPane><TabPane label="标签2" tab="tab1"><Tabs name="tab1-2"><TabPane label="标签2-1" >标签2-1的内容</TabPane><TabPane label="标签2-2" tab="tab1-2">标签2-2的内容</TabPane></Tabs></TabPane>
</Tabs>

运行结果：

https://blog.csdn.net/wang_xiao_ye/article/details/90023979

iview中嵌套使用tabs注意事项相关推荐

在iview中使用ref主要事项：
在iview中使用ref主要事项: 在我开发中遇到一个需求:在2个表格嵌套的情况下按下回车键获取下一个input框的焦点案例: ref的深入理解: //js document.getElements ...
在iView中动态创建表格
最近在使用iView中的表格组件时,碰到许多坑和疑惑,仔细研究了一下table组件,发现官方文档讲的不是很清楚,本文将介绍并使用table组件,做一个动态创建表格的demo,效果如下图. 一.在col ...
oracle urlencode 中文,Python2和Python3中urllib库中urlencode的使用注意事项
前言在Python中,我们通常使用urllib中的urlencode方法将字典编码,用于提交数据给url等操作,但是在Python2和Python3中urllib模块中所提供的urlencode的包 ...
latex下IEEE模板中嵌套Python代码
如果想在LATEX中嵌套Python代码推荐使用listings 先 \usepackage[procnames]{listings} 然后在正文中使用 \lstset{language=Python ...
pandas.core.frame.DataFrame是什么数据结构，为什么要如此取值 [ ]中嵌套[ ]
pandas.core.frame.DataFrame是什么数据结构,为什么要如此取值 [ ]中嵌套[ ] bmi_life_model.fit(bmi_life_data[['BMI']], bm ...
scrollview中嵌套listview产生冲突问题
在scrollview中嵌套listview或者gridview时如果listview或者gridview的高度时wrap-content会导致两者只显示一行多一点原因: listview和gri ...
2018.3.29 网页中嵌套网页的两种方法
第一种: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
【C 语言】结构体 ( 结构体中嵌套二级指针 | 为结构体内的二级指针成员分配内存 | 释放结构体内的二级指针成员内存 )
文章目录一.结构体中嵌套二级指针 1.结构体中嵌套二级指针类型声明 2.为结构体内的二级指针成员分配内存 3.释放结构体内的二级指针成员内存二.完整代码示例一.结构体中嵌套二级指针 1 ...
【C 语言】结构体 ( 结构体中嵌套一级指针 | 分配内存时先为结构体分配内存然后再为指针分配内存 | 释放内存时先释放指针成员内存然后再释放结构头内存 )
文章目录一.结构体中嵌套一级指针 1.声明结构体类型 2.为结构体变量分配内存 ( 分配内存时先为结构体分配内存然后再为指针分配内存 ) 3.释放结构体内存 ( 释放内存时先释放指针成员 ...

iview中嵌套使用tabs注意事项

iview中嵌套使用tabs注意事项相关推荐

最新文章

热门文章