关于前端:elcascader插件-选中值和初始值相同时不能触发change事件无需修改源码

网上一查,发现都是批改源码的计划,不太敌对,所以本人尝试了一下

1.级联选择器应用的懒加载

<el-cascader ref="city" v-model="formItem.city" class="w250" :props="citys" :show-all-levels="false" :placeholder="formItem.addvnm?formItem.addvnm:'全国'" />

ps:因为数据异步获取,回显只好默认展现placeholder

2.以下是获取城市级联

citys: {        lazy: true,        emitPath: false,        lazyLoad(node, resolve) {          const { level } = node          const params = {}          if (level === 0) {            params.v_name = 'PROAD_QUERY'          } else if (level === 1) {            params.v_name = 'CITYAD_QUERY'            params.ProAdCode = node.value          } else if (level === 2) {            params.v_name = 'ADMINAD_QUERY'            params.CityAdCode = node.value          } else {            return resolve([])          }          getCity(params).then(res => {            const nodes = res.map(item => ({              value: item.ProAdCode || item.CityAdCode || item.AdminCode,              label: item.name,              leaf: level >= 2            }))            if (level === 0) {              nodes.unshift({ value: 'all', label: '全国' })            }            resolve(nodes)          })        }      },

成果如下

编辑的时候发现初始选中全国,批改其它城市触发change事件,再切换回全国,发现无奈触发change事件

所以先默认赋一个空值

// 编辑/新增    editRead(type) {      if (type === 'add') {        this.modalTitle = '新增'      } else {        this.modalTitle = '编辑'        this.formItem = Object.assign({}, type)        this.formItem.city = ''      }      this.modalShow = true      this.formItem.addcd ? this.formItem.addcd : 'all'    },

重点就是
this.formItem.city = ''
而后模态框显示之后从新赋值
this.formItem.addcd ? this.formItem.addcd : 'all'