elementUI级联动态加载,编辑时回显问题

3,902 阅读1分钟

编辑表格数据时,有个级联数据需要回显

<el-cascader ref="childComponent" v-model="nodes"></el-cascader>

父组件拿到后端返回数据,调用子组件中setAreaShow方法(areaIds为存放每一级id的数组):

this.$refs.childComponent.setAreaShow(areaIds)

子组件methods中:

setAreaShow(areaIds){
  this.nodes = areaIds
  let area = this.$refs['area'] 
  area.panel.activePath = [] 
  area.panel.loadCount = 0  
  area.panel.lazyLoad()
}

如果会出现时而回显不出来的情况... 在el-cascader上加个v-if="isShowInfo",然后在setAreaShow方法最后加上:

this.isShowInfo = false
setTimeout(() => {
 this.isShowInfo = true
}, 100)

目的是用定时器重新载入一下组件,就可以触发组件拉取数据