antd a-select组件placeholder不显示解决办法和原因

最新推荐文章于 2024-05-03 11:08:18 发布

汤姆丁1111

最新推荐文章于 2024-05-03 11:08:18 发布

阅读量4.8k

点赞数 7

文章标签： javascript 前端 java

本文链接：https://blog.csdn.net/weixin_53841730/article/details/126281568

版权

       <a-select
          ref="select"
          v-model:value="formState.parentId"
          style="width: 100%"
          placeholder="请选择"
        >
        </a-select>
   setup(props, { emit }) {
    const formState = reactive<Form>({
      parentId: undefined,//不能为''或者null
    })

解决办法：placeholder不显示是因为设置了value值为"或者null，把value值设为undefined就可以了

原因：placeholder是当前组件值为空时显示的替换文本，只有值为空的时候才会显示。当组件绑定了value后，值不再是空，即时初始化值为""或null也视为有值，所以placeholder自然就不会显示。