vue+elementui-tree树形控件 default-expanded-keys失效及动态绑定问题

问题描述:vue+elementui-tree树形控件 default-expanded-keys失效及动态绑定问题,具体问题场景是这样:做了一个弹窗tree组件,指定了node-key=“id”,同时设置了:default-expanded-keys=“key”,这个key是动态设置值的数组。第一次打开弹窗时,展开没有反应,第二次打开弹窗就生效了。

分析:首先说明一下,要使用default-expanded-keys,需指定node-key,作为你数据中的唯一标识id。这个文档里也有说明。这块没有问题。其次,检查了每次打开,不管是第一次和第二次,key里面都有id数据,后来终于发现问题所在:key里面确实有id数据,但是是字符串类型。而tree的data数据里,id是数字型。问题就出在这里!!!

比如,你加入:default-checked-keys="[1]"属性,数组中的内容1就是你指定的id的值,也就是key的值

但我发现返回key里面的id是字符串类型的,所以只写数字的话不生效  [1]

data: [{
   
label: '一级 1',
   
id:1,
   
children: [{
       
label: '二级 1-1',
       
id:11,
    }]
}, {
   
label: '一级 2',
   
id:2,
   
children: [{
       
label: '二级 2-1',
       
id:22,
    }]
}],

上面改成‘1’,‘11’,‘2’,‘22’ 就可以了!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Julian向前冲

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值