vue中有多个select下拉的时候出现选择一个下拉内容,另一个下拉也变或者下拉选项都变蓝色无法使用解决思路

server/2024/10/19 7:26:47/

vue中有多个select下拉的时候出现选择一个下拉内容,另一个下拉也变或者下拉选项都变蓝色无法使用解决思路

以该代码为例:(这是正确写法的代码)

 <el-form-item label="入库商品名称" prop="goodsName"><el-selectv-model="valueGoods"value-key="id"placeholder="请选择商品"><el-optionv-for="item in optionsGoods":key="item.id":label="item.goodsName":value="item"></el-option></el-select></el-form-item><el-form-item label="入库库存名称" prop="wareHouseName"><el-selectv-model="valueWareHouse"value-key="id"placeholder="请选择仓库"><el-optionv-for="item in optionsWareHouse":key="item.id":label="item.wareHouseName":value="item"></el-option></el-select></el-form-item>

在上代码中有两个select下拉。
分析出现变蓝不能选中,是因为在下拉元素的值绑定出现问题
vue中规定select下拉的option中的value的值只能是基本数据类型,如果赋值了对象,就会报蓝,不能对下拉内容进行选择
解决思路,可以在select的标签中设置一个value-key的属性,该属性必须是唯一的可区分的,不然没效果。


http://www.ppmy.cn/server/23503.html

相关文章

qt5core.dll怎么下载,qt5core.dll丢失能否修复?

qt5core.dll的丢失真是让人头疼。这个Visual C Redistributable for Visual Studio 2015的运行时库被许多程序和游戏所依赖&#xff0c;一旦缺失了qt5core.dll&#xff0c;就会面临无法打开程序或游戏&#xff0c;甚至系统崩溃等一系列问题。 qt5core.dll的消失会带来以下麻烦 …

如何申请免费SSL证书,把网站升级成HTTPS

HTTPS&#xff08;Hyper Text Transfer Protocol Secure&#xff09;是一种用于安全数据传输的网络协议&#xff0c;它可以有效地保护网站和用户之间的通信安全。然而&#xff0c;要使一个网站从HTTP升级到HTTPS&#xff0c;就需要一个SSL证书。那么&#xff0c;如何申请免费的…

pytest教程-34-钩子函数-pytest_configure

领取资料&#xff0c;咨询答疑&#xff0c;请➕wei: June__Go 上一小节我们学习了pytest_addoption钩子函数的使用方法&#xff0c;本小节我们讲解一下pytest_configure钩子函数的使用方法。 pytest_configure(config) 是一个 pytest 钩子函数&#xff0c;它在 pytest 配置完…

python爬虫(Selenium案列)第二十四

&#x1f388;&#x1f388;作者主页&#xff1a; 喔的嘛呀&#x1f388;&#x1f388; &#x1f388;&#x1f388;所属专栏&#xff1a;python爬虫学习&#x1f388;&#x1f388; ✨✨谢谢大家捧场&#xff0c;祝屏幕前的小伙伴们每天都有好运相伴左右&#xff0c;一定要天天…

命令行启动pytest自动化程序时,程序卡住不动了,不继续往下执行了

一、问题描述 在执行pytestallure自动化测试工具的时候&#xff0c;命令行启动程序时&#xff0c;程序卡住不继续往下执行&#xff0c;如下图所示。 代码主函数如下&#xff1a; 二、解决方法 测试客户项目时遇到2次此类问题&#xff0c;2次问题原因不一样。 原因一&#xf…

前端点击地图上的位置获取当前经纬度

地图封装组件 <template><div id"container"></div> </template> <script>import AMapLoader from amap/amap-jsapi-loader;export default {name: "Mapview",props:{mapinfo:{type:Object,default:function(){return {}}}…

uniapp实现点击事件跳转页面

首先定义一个点击事件 这里采用的vue3的写法&#xff0c;然后写上触发事件后要跳转的路径 function jump() {uni.switchTab({url:/pages/bangong/index})} 到这里就简单的实现uniapp的点击跳转页面了

All in One mini主机搭建全屋主路由方案----自己实现自己的路由器,实现路由器自由!

1 接线 首先&#xff0c;需要保证家里当前状态是有网的状态&#xff08;路由器有网并正常工作&#xff09; 将鼠标键盘接在mini主机的USB口&#xff0c;HDMP/DP/VGA等接上显示器。从路由器的lan口接一根网线出来接在mini主机的ETH0上&#xff0c;接在mini主机上保证mini主机在…