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属性结合三元运算符处理。

相关推荐
callJJ18 小时前
Volta + Claude Code 在 Windows 上的路径 Bug 复盘
windows·bug
xsc-xyc1 天前
记一次RK3568搭建NAS BUG:开发板插上 USB 移动硬盘没反应
bug
放风铃的兔子3 天前
我把 5 个 Python bug 投进 CubeSandbox 当沙盘 —— 从 envd 协议反编译到一键 RED→GREEN
bug·issue
zh_xuan3 天前
诡异Bug:输入框删除字符,却越删越多
android·bug
绘梨衣5474 天前
采集基类设计遇到的描述符bug
爬虫·python·bug
不吃鱼的羊4 天前
达芬奇工具Bug
bug
油炸自行车4 天前
【bug】Qt 6 Q_NAMESPACE 跨 DLL 链接错误:LNK2019 无法解析 staticMetaObject
数据库·c++·qt·bug·link2019·q_namespace_exp·namespaceexport
sxd20015 天前
Debian #1135514 bug引发的思考
网络·debian·bug
疏狂难除7 天前
X86-64 Assembly中printf 打印 float 和 double的bug的解决
bug·assembly
nashane8 天前
HarmonyOS 6学习:指南针“文图反向”Bug修复——从“北偏东”变“北偏西”的坐标系纠错
学习·华为·bug·harmonyos