哈喽哇大家，感觉好久不见咯，儿童节过的还开心嘛，hhh，昨天我可没有偷懒，我是上班了的，只不过没有遇到什么问题，所以呢就没有分享，这不是今天就遇到了就来了！
那让我们步入正题吧
我今天要说的是ant下的select下拉框，正常的使用的话，配置好ant然后引用就是这样的
<a-select
style="
width: 300px;
border: 1px #ccc solid;
border-radius: 8px;
"
allowClear
v-model:value="opt1Val"
placeholder="请选择设备名称"
@change="selectOpt1Change"
>
<a-select-option
v-for="(opt, index) in options1"
:key="index"
:value="opt.no"
>{{ opt.deviceName }}</a-select-option
>
</a-select>v-model、placeholder、@change以及样式的设置我们就不多说了，大家肯定也都知道，默认的下拉框就是单选的，如果要改为多选也是非常的简单，只需要多加一个mode = ’multiple‘就可以了，修改过的代码就是
<a-select
style="
width: 300px;
border: 1px #ccc solid;
border-radius: 8px;
"
allowClear
v-model:value="opt1Val"
placeholder="请选择设备名称"
@change="selectOpt1Change"
mode= 'multiple' //多选属性
>
<a-select-option
v-for="(opt, index) in options1"
:key="index"
:value="opt.no"
>{{ opt.deviceName }}</a-select-option
>
</a-select>好啦，修改这个很简单，但是不要忘记了将绑定的v-model的值之类的同步更改为[]，否则可是会报错滴，然后呢我们就来到了一个非常重要的知识点，我每次都会遇到的，其实也不难，就是对我来说些许复杂，那就是改为多选之后，默认的值placeholder为自动跑到右边去，不自动居左了，所以就需要我们对其进行设置
相信你们也看到了代码中没有体现，所以说明简单的style控制不住他，所以要怎么写呢，要打开我们的控制台，然后找到元素，然后一个一个的对比，找到对应的placeholder，然后进行设置，就像代码所示，同时结合图片：要加deep和import 深度控制，并且优先级最高
// ant-select-selection-placeholder
:deep(.ant-select-selection-placeholder) {
text-align: left;
}具体的查找的方法就是
好啦，这样我们就实现了想要的效果了我也不多说啦，我要准备下班啦，本来还想再分享一篇的，但是被耽误了点，等明天有时间我在继续分享，明天见~