vue3中弹框中的el-select下拉组件显示value而不显示label

1.场景

使用element-ui中的el-select,给选择框赋值时显示的值是value不是label

2.原因分析

3.解决方法

在点击编辑按钮后将获取到的对象中的os属性值改为string类型

html 复制代码
<el-select v-model="form.os" clearable placeholder="请选择" style="width: 100%;">
  <el-option v-for="item in datas.optionsList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
javascript 复制代码
// 编辑
const editBtn = (row) => {
  console.log('编辑商品', row);
  form.value.serverAddress = row.serverAddress
  form.value.os = String(row.os)
}

4.总结

说白了就是列表中的数据与下拉列表数据中的value值的类型不同,只要改成类型相同就能解决该问题了

相关推荐
码客前端2 分钟前
理解 Flex 布局中的 flex:1 与 min-width: 0 问题
前端·css·css3
Komorebi゛2 分钟前
【CSS】圆锥渐变流光效果边框样式实现
前端·css
工藤学编程15 分钟前
零基础学AI大模型之CoT思维链和ReAct推理行动
前端·人工智能·react.js
徐同保15 分钟前
上传文件,在前端用 pdf.js 提取 上传的pdf文件中的图片
前端·javascript·pdf
怕浪猫16 分钟前
React从入门到出门第四章 组件通讯与全局状态管理
前端·javascript·react.js
博主花神17 分钟前
【React】扩展知识点
javascript·react.js·ecmascript
内存不泄露22 分钟前
基于Spring Boot和Vue 3的智能心理健康咨询平台设计与实现
vue.js·spring boot·后端
欧阳天风24 分钟前
用setTimeout代替setInterval
开发语言·前端·javascript
EndingCoder28 分钟前
箭头函数和 this 绑定
linux·前端·javascript·typescript
郑州光合科技余经理28 分钟前
架构解析:同城本地生活服务o2o平台海外版
大数据·开发语言·前端·人工智能·架构·php·生活