博客
关于我
ant design vue中Tree树形控件defaultExpandAll设置无效
阅读量:391 次
发布时间:2019-03-05

本文共 3171 字,大约阅读时间需要 10 分钟。

Tree树形控件 ,defaultExpandAll 仅在组件第一次渲染时有效,tree组件、其它组件的defaultXXX值都是这个行为。

解决:

treeData数据:

treeData = [{           title: '权限管理',        key: '0-0',        children: [{                   title: '用户管理',                key: '0-0-0',                children: [{                           title: '全选',                        key: '0-0-0-0'                    },                    {                           title: '新增',                        key: '0-0-0-1'                    },                    {                           title: '查询',                        key: '0-0-0-2'                    },                    {                           title: '详情',                        key: '0-0-0-3'                    },                    {                           title: '修改',                        key: '0-0-0-4'                    },                    {                           title: '删除',                        key: '0-0-0-5'                    },                    {                           title: '导入',                        key: '0-0-0-6'                    },                    {                           title: '导出',                        key: '0-0-0-7'                    }                ]            },            {                   title: '0-0-1',                key: '0-0-1',                children: [{                           title: '0-0-1-0',                        key: '0-0-1-0',                        class: 'last',                        children: [{                                   title: '新增',                                key: '0-0-1-0-2'                            },                            {                                   title: '删除',                                key: '0-0-1-1-2'                            },                            {                                   title: '修改',                                key: '0-0-1-2-2'                            }                        ]                    },                    {                           title: '0-0-1-1',                        key: '0-0-1-1'                    },                    {                           title: '0-0-1-2',                        key: '0-0-1-2'                    }                ]            },            {                   title: '0-0-2',                key: '0-0-2'            }        ]    },    {           title: '0-1',        key: '0-1',        children: [{                   title: '0-1-0-0',                key: '0-1-0-0'            },            {                   title: '0-1-0-1',                key: '0-1-0-1'            },            {                   title: '0-1-0-2',                key: '0-1-0-2'            }        ]    },    {           title: '0-2',        key: '0-2'    }]

第一步:v-if="treeData && treeData.length > 0"

第二步:

// @change="switchMenu"        switchMenu(value, option){             console.log(value)          //defaultExpandAll 仅在组件第一次渲染时有效,实现展开收起的效果,做点手脚          let treeData_ = this.treeData          this.treeData = []          setTimeout(()=>{               this.defaultExpandAllMenu = value            this.treeData = treeData_          },500)        },

转载地址:http://qjxg.baihongyu.com/

你可能感兴趣的文章
myeclipse的新建severlet不见解决方法
查看>>
MyEclipse设置当前行背景颜色、选中单词前景色、背景色
查看>>
Mtab书签导航程序 LinkStore/getIcon SQL注入漏洞复现
查看>>
myeclipse配置springmvc教程
查看>>
MyEclipse配置SVN
查看>>
MTCNN 人脸检测
查看>>
MyEcplise中SpringBoot怎样定制启动banner?
查看>>
MyPython
查看>>
MTD技术介绍
查看>>
MySQL
查看>>
MySQL
查看>>
mysql
查看>>
MTK Android 如何获取系统权限
查看>>
MySQL - 4种基本索引、聚簇索引和非聚索引、索引失效情况、SQL 优化
查看>>
MySQL - ERROR 1406
查看>>
mysql - 视图
查看>>
MySQL - 解读MySQL事务与锁机制
查看>>
MTTR、MTBF、MTTF的大白话理解
查看>>
mt_rand
查看>>
mysql -存储过程
查看>>