el-select赋值对象是对象时,出现赋值与展示不一致问题

代码逻辑类似:module 是个object

{

"appId": "",

"id": 65,

"name": ""

}

复制代码
 <el-form :model="form">
           
            <el-form-item label="申请模块" >
                <el-select v-model="form.module">
                     <el-option
                          v-for="module in module_list"
                          :key="module .id"
                          :label="module .name"
                          :value="module">
                        </el-option>
                </el-select>

</el-form>

赋值后总是出现展示的和实际赋值的不一致。原来是因为缺少了 value-key 作为它的唯一性标识。

如果 Select 的绑定值为对象类型,请务必指定 value-key 作为它的唯一性标识。

加上value-key就好了

复制代码
 <el-form :model="form">
           
            <el-form-item label="申请模块" value-key="id">
                <el-select v-model="form.module">
                     <el-option
                          v-for="module in module_list"
                          :key="module .id"
                          :label="module .name"
                          :value="module">
                        </el-option>
                </el-select>

</el-form>
相关推荐
C澒5 小时前
Vue 项目渐进式迁移 React:组件库接入与跨框架协同技术方案
前端·vue.js·react.js·架构·系统架构
清山博客6 小时前
OpenCV 人脸识别和比对工具
前端·webpack·node.js
要加油哦~6 小时前
AI | 实践教程 - ScreenCoder | 多agents前端代码生成
前端·javascript·人工智能
程序员Sunday6 小时前
说点不一样的。GPT-5.3 与 Claude Opus 4.6 同时炸场,前端变天了?
前端·gpt·状态模式
yq1982043011566 小时前
静思书屋:基于Java Web技术栈构建高性能图书信息平台实践
java·开发语言·前端
aPurpleBerry6 小时前
monorepo (Monolithic Repository) pnpm rush
前端
青茶3606 小时前
php怎么实现订单接口状态轮询请求
前端·javascript·php
鹏北海6 小时前
micro-app 微前端项目部署指南
前端·nginx·微服务
发现一只大呆瓜6 小时前
虚拟列表:从定高到动态高度的 Vue 3 & React 满分实现
前端·vue.js·react.js
css趣多多6 小时前
add组件增删改的表单处理
java·服务器·前端