使用el-cascader"报错TypeError: Cannot read property 'level' of null"的解决

一、问题描述

在使用Cascader 级联选择器中的el-cascader组件进行级联效果实现的时候,想要实现级联选择器中根据指定条件默认选中级联选项的效果,但是设置完默认选项之后虽然可以显示预想的效果,但是总是会报以上的错误。

二、解决方法

因为Cascader下拉进行显示的数据是由后台接口进行提供,在进行默认值显示修改时,将后台返回的数据赋值给v-model绑定的数据,进行如此的赋值是能够实现默认值改变显示的,但是在改变榜单类型后,Cascader的options动态的进行了改变,使得Cascader的绑定数值在下拉选项中不存在。总之就是因为点击或者选中了父节点改变了榜单的类型,从而options进行动态得改变了,改变之后因为没有了这个父节点就会产生报错。当然,只要activePath 不改变就会产生报错。

在改变榜单类型,然后options改变之后,只需要通过重新渲染Cascader组件就可以解决了。
我使用了如下的方法进行重新渲染Cascader解决的:
       给Cascader设置了一个key值(注意需要在先初始化:isResouceShow: 0)

       原理是在改变榜单类型时也顺带着改变下key值,key值改变了,Cascader就能进行重新渲染了。实现如下:

  • 22
    点赞
  • 25
    收藏
    觉得还不错? 一键收藏
  • 20
    评论
评论 20
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值