博客
关于我
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/

你可能感兴趣的文章
MQ 重复消费如何解决?
查看>>
mqtt broker服务端
查看>>
MQTT 保留消息
查看>>
MQTT 持久会话与 Clean Session 详解
查看>>
MQTT介绍及与其他协议的比较
查看>>
MQTT工作笔记0007---剩余长度
查看>>
MQTT工作笔记0008---服务质量
查看>>
MQTT工作笔记0009---订阅主题和订阅确认
查看>>
Mqtt搭建代理服务器进行通信-浅析
查看>>
MS COCO数据集介绍
查看>>
MS Edge浏览器“STATUS_INVALID_IMAGE_HASH“兼容性问题
查看>>
ms sql server 2008 sp2更新异常
查看>>
MS SQL查询库、表、列数据结构信息汇总
查看>>
MS UC 2013-0-Prepare Tool
查看>>
MSBuild 教程(2)
查看>>
msbuild发布web应用程序
查看>>
MSB与LSB
查看>>
MSCRM调用外部JS文件
查看>>
MSCRM调用外部JS文件
查看>>
MSEdgeDriver (Chromium) 不适用于版本 >= 79.0.313 (Canary)
查看>>