element el-option value绑定对象

最新推荐文章于 2024-02-23 11:39:52 发布
最新推荐文章于 2024-02-23 11:39:52 发布
阅读量5.2k 收藏 5
点赞数 5
分类专栏： element-ui vue 项目经验
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/versious/article/details/112687116
版权
项目经验 同时被 3 个专栏收录
38 篇文章 0 订阅
订阅专栏
vue
28 篇文章 1 订阅
订阅专栏
element-ui
8 篇文章 0 订阅
订阅专栏

场景：select选项改变后，下面的项目名字要替换成label的值，但是又需要用到项目guid,于是想把v-modle上的值改成一个对象

<el-select v-model="selectedProjectObj" value-key="projectGUIDs" filterable clearable placeholder="请选择" class="project-select" size="small" @change="selectChange">
     <el-option v-for="item in projectList" :key="item.projectGUIDs" :label="item.label" :value="item"> </el-option>
</el-select>

el-option上绑定的value为对象，select上面的value-key作为唯一标识

versious
关注
  • 5
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 12
    评论
专栏目录
vue修改Element的el-table样式的4种方法
10-14
主要介绍了vue修改Element的el-table样式的4种方法，帮助大家更好的理解和使用vue，感兴趣的朋友可以了解下
修复el-select 绑定值value为对象类型，选中一个所有都选中了
07-19 1216
el-select的value绑定的是对象，但是选中后，远程搜索的所有结构都是选中样式。
Element Plus 的下拉选择器el-option的字体全部蓝色，全部是选中状态
最新发布
LlanyW的专栏
02-23 723
给每个item添加一个value字段，值任意,这个是在开发误写value值，发现它也能解决问题。给外层el-select增加一个value-key指定值: value-key="ID"placeholder="请输入商品名/关键字"
element el-tree组件的动态加载、新增、更新节点的实现
10-15
主要介绍了element el-tree组件的动态加载、新增、更新节点的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Element-ui中元素滚动时el-option超出元素区域的问题
10-16
主要介绍了Element-ui中元素滚动时el-option超出元素区域的问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
element中el-option控件的value选项绑定对象以及自定义option
热门推荐
weixin_44092905的博客
01-26 1万+
一.绑定对象 有时候选中el-option中某一个选项的时候，不仅要获取到这个item的item_id，还需要使用到item中保存的其他数据，这个时候就需要，将value绑定的值设置为整个item <el-select v-model="value" value-key="item_id" placeholder="请选择"> <el-option v-for="item in options" :key="item.value"
el-option的:value绑定整个对象
weixin_51780751的博客
11-16 1577
这两张图说明：el-option的value是可以绑定对象的，但是要加value-key这个属性。
【Element】el-option value 绑定对象类型（item）
日常问题bug解决、学习分享、个人杂谈等等随便写写哈哈哈
05-13 329
el-option 上绑定的 value 为对象(item)，select 上面的 value-key 以 :key 的值作为唯一标识。
el-option绑定的value值为对象时
qq_37970529的博客
06-22 731
el-option绑定的value值为对象时
解决el-select通过v-model绑定对象的某个代码值，修改后代码变了，名称未变的问题
weixin_44531910的博客
12-01 728
el-select 使用下面的方式绑定数据后，切换后Model对象中只有Code的值可以跟着变化，Name的值不会变化，要实现在Model对象中的Code值变化的时候Name的值跟着变化。来查找对应的部门数据，然后将对应的部门名称赋值给。这样，无论是通过编辑切换或者直接修改。的属性，里面定义了一个监听。
el-select同时获取label和value，value值绑定对象报错
m0_47733490的博客
08-30 775
同时获取label和value且值有唯一的键值对应
vue+element获取el-table某行的下标,根据下标操作数组对象方式
10-14
主要介绍了vue+element获取el-table某行的下标,根据下标操作数组对象方式，具有很好的参考价值，希望对大家有所帮助。一起跟随想过来看看吧
Element UI下拉列表el-option中的key、value、label含义
CLAY_Z的博客
05-11 5853
相当于身份令牌，唯一的令牌，防止出错。这个key没有也行，但是保险起见最好加上。因为这个key作为 value 唯一标识的键名，绑定值为对象类型时必填。这是给用户看的，当点击下拉菜单时，会出来选项，用户看到的选项就是这个这是你点击某个label(option)之后，将对应的值给v-model绑定的值model。
vue elementUI 选择器select选中值value为对象
SHERLOCK_96的博客
03-01 1232
elementUI 有时候保存选择器需要绑定对象中的多个值，此时需要加一个属性：value-key，记得修改：value为对象哦~ 示例 ： html <el-select style="width:300px" clearable value-key="name" //修改的关键 @change="changeMethod" v-model="value" placeholder="请选择"
vue el-select option 值为对象时，选择完没有回显值问题
l15031138244的博客
09-05 1767
代码如下 var arr = [{"supplierId":"12","supplierName":"张飒"},"supplierId":"13","supplierName":"张飒3"},"supplierId":"14","supplierName":"张飒4"}]; <el-select v-model.trim="selectShow" filterable ...
elementui 中下拉选（el-select）的options为对象时，遇到的坑
qq_52373373的博客
07-13 580
elementui 中下拉选（el-select）的options为对象时候，遇到的坑
Vue-Element 使用笔记
既然青春留不住，还是做个大叔好!
07-10 197
前言 说明：在使用Elment组件时，难免会有一些不习惯或者没有仔细看API文档导致出不来自己想要的效果。好比做一道菜比如鱼，element组件的属性是配料，事件方法是烹饪的工具，如果配料不对自然味道出不来，如果工具使用不当，那做的可能不是鱼。 注意：element-UI和antd都是用户十分庞大且具有权威性，其内封装的方法/属性基本能解决大部分需求，遇到问题时，第一选择永远是看官方API文档！本文只是做一些总结，把平时遇到的问题，作一个纠错笔记。 食用 el-select 官方示例给的是一个静态数据，
element下拉框绑定的value为对象时，数据不改变的解决方法
李白爱睡觉的博客
10-12 1655
在后台项目的开发中，遇到了select下拉框需要绑定obj的情况，但是选中一个值后再改变，框内的值不变，并且所有选项变蓝色，查到的方法为，在el-select添加value-key:作为 value 唯一标识的键名，绑定值为对象类型时必填，修改后解决： <template slot="formCodeForm" slot-scope="scope"> <el-select v-model="form.formCode" value-key
el-select 当 value是对象时 label显示问题
QQ2856639881的专栏
06-01 470
el-select 当 value是对象时 label显示问题
element el-select选项value不反悔
07-25
<el-option value="value1">选项1</el-option> <el-option value="value2">选项2</el-option> </el-select> ``` 2. 数据绑定错误：请检查v-model绑定的数据是否正确。确保selectedValue变量在Vue实例中定义，并且...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 12
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值