select 组件隐藏已选择的数据

[Dylan-lijl]

trafficstars

• [ ] I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

由于下拉数据太多,已选中的数据隐藏对应的下拉选项(多个下拉选使用同一个下拉列表数据),达到可选项减少能优化操作; 该功能需求源于之前的错误bug---->https://github.com/vueComponent/ant-design-vue/issues/7657

What does the proposed API look like?

select提供一个隐藏数组或者根据option的display来控制

[Aaron-zon]

[Dylan-lijl]

不一样,你这个示例没有label属性,大部分场景显示label而不是value,当只有value值label就会失效,这又回到之前说的bug

[Aaron-zon]

哦哦，我懂了，那这个看起来确实不行。

[hdtopku]

确实是个 bug

const selectedRoleIds = ref<string[]>([]);
let roleList = ref([{"1":"超级管理员"},{"2":"开发者"}])
const filteredOptions = computed(() => {
return roleList.value.filter((item:any) => !selectedRoleIds.value.includes(item.id)).map(item => ({
    value: item.id,
    label: item.roleName
  }))
})
 <a-select key="id" allow-clear v-model:value="selectedRoleIds" mode="multiple"
                  :options="filteredOptions" placeholder="请选择角色">
          <template #tagRender="{ value: val, label, closable, onClose, option }">
            <a-tag :closable="closable" style="margin-right: 3px" @close="onClose">
              {{ label }}/{{ val }}
            </a-tag>
          </template>
        </a-select>

选择前 选择后

template的 label 的值被设置为了value的值

[github-actions[bot]]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days