select 标签 未选择任何内容 在 vue.js 中使用遇到的坑

Posted 2021-11-28 ninetailfox

select 标签使用时，经常会遇到不进行任何的选择，即 value=‘’ 的情况

这时如果配合  vue.js 的 v-model 使用，会使得 v-model 标签失效，也就是说，v-model 标签配合 select 不能存在  <option value="" ></option>的情况

但是如果，我们必须有什么也不选择的选项的话，我们可以 <option value="%" >点击选择...</option>这样写，

这样使得页面显示的样式和   <option value="" ></option> 显示的样式一模一样（谷歌浏览器）

如果要保存这个数据，在前台提交时或后台做处理

有人说，我为什么一定要用 % 号呢，这时因为，如果我们这个下拉框，作为一个条件去查询时，后台我们拼接SQL的时候，把这个value拼接上

一般我们会写   =‘这个value’，现在我们写成  like ‘这个value‘，

这样当我们前端选择     点击选择...    这个选项，后台SQL拼接的效果为  like‘%‘,这样相当于忽略了这个条件，不用做非空校验处理，而且不耽误我们使用  like ‘1‘ 这种用法

 

这是我想到的最好的办法，我没有想到其他更好的办法，解决这个 value="" 的问题，如果有，留言告诉我，不胜感激