vue3+ts+antd-vue(2.1.2)，如何将select组件多选按钮如何把CheckBox做出来

不多比比，直接上图：

官方：

官方没有checkbox的这个API，直接改css：

官方既然没有，我们只能自己写，直接改css：

/* 将后面的对钩隐藏 */
.ant-select-dropdown.ant-select-dropdown-placement-bottomLeft .ant-select-item-option-selected .ant-select-item-option-state,.ant-select-dropdown.ant-select-dropdown-placement-bottomLeft .ant-select-item-option-selected:hover .ant-select-item-option-state,.ant-select-dropdown.ant-select-dropdown-placement-bottomLeft .ant-select-item-option:hover .ant-select-item-option-state{
    color:#1885ff;
    display:none
}
/* 将item所有内容前增加未点击背景 */
.ant-select-dropdown.ant-select-dropdown-placement-bottomLeft .ant-select-item-option:after{
    content:'';
    width:20px;
    height:20px;
    display:inline-block;
    position:absolte;
    background: url('UnChecked.png') no-repeat;
    left:7px;
    top:9px
}
/* 将item所有内容前增加点击背景 */
.ant-select-dropdown.ant-select-dropdown-placement-bottomLeft .ant-select-item-option-selected:after{
    content:'';
    width:20px;
    height:20px;
    display:inline-block;
    position:absolte;
    background: url('Checked.png') no-repeat;
    left:7px;
    top:9px
}
/* 将item所有内容做内边距向右移动，这样CheckBox不会遮挡内容 */
.ant-select-dropdown.ant-select-dropdown-placement-bottomLeft .ant-select-item-option{
    padding-left:32px;
    padding-right:0px
}

这样我们就得到了多选a-select中的CheckBox效果了，当然如果想修改触碰效果的背景也是可以实现的，这就留着小伙伴们自己探索了

再补充一句：antd-vue(2.1.2)版本适用于vue3+ts，如果是vue2+js的，其实是同理，只不过类名不一样，大家多注意

参考官方文档：https://2x.antdv.com/components/select-cn