el-select 默认值显示value不显示label问题

最新推荐文章于 2024-08-13 14:10:55 发布
最新推荐文章于 2024-08-13 14:10:55 发布
阅读量9.3k 收藏 3
点赞数 5
分类专栏： element-ui VUE 文章标签： el-select vue element-ui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_34403976/article/details/101550155
版权

el-select 默认值显示value不显示label问题

在做编辑页面时
需要取到列表项数据回显默认值
在做select回显的时候遇到了这个问题

明明拿到的值和value中的值一样
但是就是不转换成label
这种情况一般出现在value为数字的情况

原因是

返回的数字和el-option选框里value值的类型对应不上
一个是 Numer 一个是 String

所以就不转换了
检查一下统一类型就好了

shimh_凉茶
关注
专栏目录
el-option显示value而不是lable的问题
Cc
04-21 2060
el-option显示value而不是lable的问题，后台返回数字前端想要显示文字
elementUI的el-select 默认值显示value不显示label问题
菜鸡涛的博客
02-28 1万+
el-select 默认值显示value不显示label问题 在做编辑页面时 需要取到列表项数据回显默认值 在做select回显的时候遇到了这个问题 明明拿到的值和value中的值一样 但是就是不转换成label 这种情况一般出现在value为数字的情况 问题 如图所示 原因是 返回的数字和el-option选框里value值的类型对应不上 一个是 Numer 一个是 String 解决后如图 ...
element-ui的el-select如何不显示value，显示value对应的label值
qq_19509799的博客
05-31 8899
我们想到得到的是下面的效果： 现在遇到问题 效果是这样的： 调试发现 是value的格式存在问题，数据库读取到的数据不一定为number类型 需要自己转换一下 代码如下即可 但是 还有一种情况就是 : 此时在赋值时候 应该使用String ...
el-select 默认选中值
最新发布
前端小菜鸟也有人起的博客
08-13 381
el-select 默认选中值
vue---解决el-select显示value不显示label的问题
maidu_xbd的博客
01-03 1万+
产生左图的情况一般是由于下图红框中的参数类型不一致 可修改【dictInfoForm.type】类型与【item.value】一致 this.dictInfoForm.type=String(this.dictInfoForm.type); //转换为String类型 this.dictInfoForm.type=Number(this.dictInf...
element-ui el-select回显显示value不显示label的问题
小宝的博客
11-26 3481
先上图，大家看图就明白了 正常情况 异常情况 数据的类型和value的类型导致的。
el-select、el-select-v2默认值显示value不显示label的问题
qq_36076928的博客
08-09 2305
el-select、el-select-v2默认值显示value不显示label的问题
el-select下拉框只回显value不回显label的原因以及解决方法
m0_63026408的博客
11-16 6076
3：如果 value类型是正确的，下拉框数据也有，还是返显的value，最后可以试一下在el-select加一个change方法中使用this.$forceUpdate()方法如下。el-select的采用的是map的key value结构，因此只显示value而不显示label的原因是，value的类型不正确，将value转换成对应的类型即可。2：如果转换了正确的类型还是返显value而不是label，那么有可能时因为下拉框的数据没有请求出来，因此没有返显相对应的label，
解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题
10-14
在使用element-ui开发Web项目时，经常会遇到一些组件使用上的细节问题，其中element-ui中的下拉多选框组件el-select使用时，如何设置默认值且不可删除，是一个较为常见的需求。本文将详细介绍如何解决这个问题，以及...
vue2.0 element-ui中el-select选择器无法显示选中的内容(解决方法)
10-18
解决el-select选择器无法显示选中内容的问题，可以考虑以下几个方面： 1. v-model绑定的正确性：确保el-select的v-model指令正确地绑定了一个模型属性，并且该属性能够响应数据变化。在Vue.js中，v-model本质上是...
详解element-ui中el-select的默认选择项问题
10-16
需要注意的是，如果`v-model`的值不在`el-option`的`value`集合中，`el-select`将不会显示任何选项，因为没有匹配的值。为了避免这种情况，我们需要确保所有可能的默认值都存在于`options`中。 此外，`el-select`...
vue中el-select无法显示默认选中值的name，直接显示值value
小白求学进阶
04-18 6874
一、背景 在写项目的过程中，突然发现el-select这个组件，绑定的值没办法显示name，而是直接显示value。在编辑项目的弹框中，要显示项目绑定了哪个数据库（项目外连数据库表主键ID），结果发现直接把关联数据库的ID显示了出来，这与我的设想不一致，因此来找找是什么问题 二、解决 有问题的，有文档的当然第一时间去看文档，一看数据类型是string。 value-key 作为 value 唯一标识的键名，绑定值为对象类型时必填 数据类型strin
element ui l-select 显示value不显示label问题
fenghuashao的博客
05-27 1572
el-select下拉列表显示value不显示label问题 在做编辑页面时 需要取到列表项数据回显默认值 在做select回显的时候遇到了这个问题 明明拿到的值和value中的值一样 但是就是不转换成label 这种情况一般出现在value为数字的情况 数字转换成字符串即可 ...
使用单选框实现编辑功能时，elementUI的el-select显示为value而不显示label的问题。
weixin_43185419的博客
09-13 1350
当前效果为： 想要的效果为： 以前实现编辑功能是通过scope.row来实现数据回显，在下拉框中都可以正常显示label值。这次第一次使用了table的单选选中后实现编辑功能，使用的是选中时回调的参数val，（标记为multipleSelection），猜测是两种方式回调的数据类型不一致，导致el-select没识别到该值为value。 html代码： <el-select placeholder="请选择状态"
vue 关于改变数据源 页面不热更新问题（举例element select选中不显示label）
weixin_42508580的博客
11-04 1606
深入响应原理（记录） 在代码中可以打印出select 的选中value 但是页面不显示对应的label //template 代码 <el-form-item label="工作模式" prop="workTypeId"> <el-select v-model="form.workTypeId" multiple @change="currentWork"> <el-option v-for="item in workTypeOp
ElementUI 的 el-select 设置值后显示value而不是label
season_hai
03-03 8485
问题:ElementUI 的 el-select 设置值后显示value而不是label 关键是这里: <el-optionlabel="在职"value="1"></el-option> 查了下百度 主要是value值的格式不一样, 我的form.state是数字, 也就是Number类型 而value="1" 表示value是字符串类型(原生HTML默认字符串类型) 要想改成数字类型 应改成 v-bind:value="1" 这时1代表的是数字类型而...
element-ui的el-select如何回显value对应的label值
热门推荐
liona_koukou的博客
11-28 2万+
写在这里只为一个记录，感谢原作者分享，原作者地址：https://segmentfault.com/a/1190000016737140?_ea=4798728 原因是value的格式存在问题，数据库读取到的数据不一定为number或string类型 需要自己转换一下 总结： 显示不正常 多数是由于得到的数据类型对应不上表单操作的数据类型 进行相应转换即可 即：option的value值如果...
element ui el-select给默认值（code/value），不显示对应的文字（lable）
小白正在变黑
12-11 1040
el-select的回显问题，可能是数据类型导致
el-select 默认值
07-14
el-select 的默认值可以通过设置 v-model 绑定的值来实现。例如，如果你想让 el-select 的默认值为 "apple"，你可以这样设置： ```html <template> <div> <el-select v-model="selectedFruit"> <el-option label="Apple" value="apple"></el-option> <el-option label="Banana" value="banana"></el-option> <el-option label="Orange" value="orange"></el-option> </el-select> </div> </template> <script> export default { data() { return { selectedFruit: 'apple' } } } </script> ``` 这样，当 el-select 第一次被渲染时，它会自动选择 "Apple" 这个选项作为默认值。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值