解决ant-design-vue中Select组件v-model值为空字符串不显示placeholder的bug

方法一:

1.找到node_modules/ant-design-vue/es/vc-select/SingleSelector.js文件

搜索renderPlacehoder方法

将其修改为

html 复制代码
const renderPlacehoder = () => {
	const list = props.values.filter(val => val.value !== '');
	if (list[0]) {
		return null
	}
	...
}

2.在此文件中继续修改

1.找到${prefixCls}-selection-item

2.在箭头所指处添加

html 复制代码
&& title.value !== ''


然后保存,如果使用的vite,那么需要删除node_modules中的.vite缓存文件夹,并且重新运行项目且打开无痕浏览器查看

方法二

自己扩展一个my-select组件,监听v-model值,当值为空字符串时,将传给Select的v-model值设置为null,该方法较为简单,就不在详细描述

相关推荐
小白学前端66641 分钟前
React Router 深入指南:从入门到进阶
前端·react.js·react
苹果醋341 分钟前
React系列(八)——React进阶知识点拓展
运维·vue.js·spring boot·nginx·课程设计
web130933203981 小时前
前端下载后端文件流,文件可以下载,但是打不开,显示“文件已损坏”的问题分析与解决方案
前端
王小王和他的小伙伴1 小时前
解决 vue3 中 echarts图表在el-dialog中显示问题
javascript·vue.js·echarts
outstanding木槿1 小时前
react+antd的Table组件编辑单元格
前端·javascript·react.js·前端框架
好名字08212 小时前
前端取Content-Disposition中的filename字段与解码(vue)
前端·javascript·vue.js·前端框架
隐形喷火龙2 小时前
element ui--下拉根据拼音首字母过滤
前端·vue.js·ui
m0_748241122 小时前
Selenium之Web元素定位
前端·selenium·测试工具
风无雨2 小时前
react杂乱笔记(一)
前端·笔记·react.js
前端小魔女2 小时前
2024-我赚到自媒体第一桶金
前端·rust