element ui cascader 动态加载回显问题解决方法

问题:请求接口获取数据,重新给cascader赋值时,页面不显示新获得数据。

解决方法:只要重新加载下cascader组件就行.

<el-cascader
   v-if="isShowInfo" // 添加v-if
   v-model="scope.row.roleIds"
   :options="scope.row.roleInfo"
   :props="{
      checkStrictly: true,
      multiple: true,
      emitPath: false,
      label: 'roleName',
      value: 'roleId',
    }"
    placeholder="请先选择租户"
    clearable
 ></el-cascader>

js 代码:

getRoleInfo(ev) {
    this.$api.user.getRoleInfo({ tenantId: ev.row.tenantId 
    }).then(response => {
     ev.row.roleInfo = response.data;
// 定时器重新载入一下组件就可以触发组件拉取数据
     this.isShowInfo = false;
      setTimeout(() => {
         this.isShowInfo = true;
      }, 100);
    });
}

 

posted @ 2020-09-27 21:19  棠樾  阅读(8435)  评论(0编辑  收藏  举报