el-cascader 多选的时候,选中后会跳到第一个

1,020 阅读1分钟
 <el-cascader
  ref="cascaderRef"
  v-model="casList"
  :options="fundInfoPageList"
  :props="{ multiple: true }"
  collapse-tags
  collapse-tags-tooltip
  :max-collapse-tags="1"
  clearable
  style="width: 100%"
  @change="change"
>
  <template #default="{ data }">
    <span class="dataLabel">
      <i v-if="data.labelType" :class="data.labelType"></i>
      {{ data.label }}
    </span>
  </template>
</el-cascader>

解决方法:将props赋值给一个变量,即:

<el-cascader
  ref="cascaderRef"
  v-model="casList"
  :options="fundInfoPageList"
  :props="cascaderProps"
  collapse-tags
  collapse-tags-tooltip
  :max-collapse-tags="1"
  clearable
  style="width: 100%"
  @change="change"
>
  <template #default="{ data }">
    <span class="dataLabel">
      <i v-if="data.labelType" :class="data.labelType"></i>
      {{ data.label }}
    </span>
  </template>
</el-cascader>

const cascaderProps = ref({
  multiple: true
});

这应该是element 的一个bug , 官方文档上有说

image.png