bug-Ant中a-select的placeholder不生效(绑定默认值为undefined)

1.问题

Ant中使用a-select下拉框时,placeholder设置输入框显示默认值提示,vue2+ant

null与undefined在js中明确的区别:

  • **null:**一个值被定义,定义为"空值"
  • **undefined:**根本不存在定义

2.解决

2.1 a-select使用v-model绑定值

问题代码

html 复制代码
<a-form-model-item>
    <a-select  v-model="ScoreType" placeholder="请选择"  @select="Change">
	</a-select>
</a-form-model-item>
javascript 复制代码
 data(){
     return{
	    ScoreType: null,
     }
   }

v-model绑定的默认值为null,绑定了placeholder,并未显示默认提示,null值默认为空,顶替了placeholder提示。

更改v-model绑定值为undefined

javascript 复制代码
 data(){
     return{
	    ScoreType: undefined,
     }
   }
2.2 a-select中使用 :valueAPI(三元判断值为null设定为undefined)
html 复制代码
<a-form-model-item>
    <a-select  :valse="ScoreType ? ScoreType : undefined" placeholder="请选择"  @select="Change">
	</a-select>
</a-form-model-item>
javascript 复制代码
 data(){
     return{
	    ScoreType: undefined,
     }
   }

3.总结

在Vue2使用AntDesign的a-select组件时,若要显示默认提示,需注意v-model的初始值。当绑定值设为undefined,placeholder才会显示。使用AntDesign的a-select组件时value属性结合三元运算符处理。

相关推荐
癫狂的兔子9 小时前
【BUG】【Python】【爬虫】爬取加载中的数据
爬虫·python·bug
wangsir.1 天前
测试之BUG篇
bug·测试
万粉变现经纪人2 天前
如何解决 pip install pyodbc 报错 缺少 ‘cl.exe’ 或 ‘sql.h’(ODBC 头文件)问题
数据库·python·sql·网络协议·bug·ssl·pip
cat2bug3 天前
介绍一下如何在Cat2Bug-Platform中通过OpenAI来创建测试用例
功能测试·测试工具·ai·测试用例·bug·openai
Lz__Heng3 天前
ESXI 6.7.0 update 2(VMware ESXi, 6.7.0, 13006603)监控采集数据已知BUG
bug·vmware
自学也学好编程3 天前
【BUG】Claude Code跳过强制登录解决方法
bug
cat2bug4 天前
介绍一下Cat2Bug-App如何连接自己的Bug平台
bug
秋天枫叶354 天前
【k8s集群Docker + cri-dockerd】服务器重启或关机后 apiserver/controller/scheduler 无法自动恢复
linux·运维·服务器·容器·kubernetes·bug
小趴菜不能喝5 天前
若依Plus 的XSSFilter 的bug
bug
朝新_6 天前
【无标题】软件测试bug篇
bug