vue2踩坑记录:el-select如何绑定对象

页面上的下拉框:

选中人员之后,需要使用人员的其它信息做后续操作。所以不能只绑定用户Id,需要绑定整个item(用户对象),这样每次change事件所获取到的newValue是整个对象,而且v-model中的变量指向的也是整个对象,方便后续操作。

但是绑定对象后,无法正确响应,点击第一个选项时,页面显示选中的是第一个人,但是后台data是正确的。

官网有这么一句话:

原来,这时必须添加value-key属性,作为 value 唯一标识的键名。

原理应该是:你给它绑定一个对象,它不知道如何判断这些对象是否相同,比如,无法判断什么时候触发change事件。。所以,需要你告诉它,通过哪个键值来判断你选中的这个对象跟上一个选中项之间是否发生了变化,所以,其值与el-option中的Key保持一致即可。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/53145.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

解决el-table中使用el-input无法聚焦问题

在el-table中点击单元格时使用el-input或其他表单组件编辑单条数据。会出现聚焦不上的问题&#xff0c;需要手动点击才能够聚焦。究其原因是因为点击单元格时页面已自动聚焦到单元格&#xff0c;此时无法自动聚焦到对应的表单&#xff0c;需要手动设置。 <template><e…

进来一起把【数据结构】的【栈与队列】狠狠玩弄,痛快到大汗淋漓

1前言&#xff1a;顾名思义&#xff0c;栈与队列是两个东西&#xff0c;栈和队列&#xff01;对的&#xff0c;栈和队列&#xff01;&#xff01;&#xff0c;没错&#xff0c;在念一遍&#xff0c;【栈】 和 【队列】&#xff01;&#xff01;&#xff01;但是本质都是差…

数字化转型工具有哪些 无锡振宁科技

数字化转型已经成为现代企业不可忽视的趋势。为了帮助企业在这个过程中取得成功&#xff0c;选择合适的工具至关重要。今天&#xff0c;无锡振宁科技想和大家聊聊一些在数字化转型中不可或缺的工具&#xff0c;以及它们具体能带来哪些优势和变化。 1. 云计算平台 云计算是数字…

Yapi部署文档

Yapi是高效、易用、功能强大的API管理平台&#xff0c;旨在为开发、产品、测试人员提供更优雅的接口管理服务 官网地址&#xff1a;Yapi 环境&#xff1a; l Git l NodeJs&#xff08;7.6&#xff09; l Mongodb&#xff08;2.6&#xff09; 1、 NodeJs的安装 获取资源 …

VBA学习(71):Excel VBA 访问带密码保护的Access数据库/用户窗体设置/EXCEL用户+密码登录界面(Access版)

前两天我们分享了一个用户密码登录EXCEL的案例【Excel VBA 用户窗体设置/一步一步代你设计EXCEL用户密码登录界面】&#xff0c;文中提及数据存储在Access中的情况&#xff0c;今天我就来把数据表&#xff08;tb用户&#xff09;移到Access中&#xff0c;修改一下代码&#xff…

cortex-m4系列绝对地址函数跳转问题

一、环境&#xff1a; cortex-m4&#xff0c;IAR&#xff0c;J-LINK。 二、问题&#xff1a; 1&#xff09;、首先&#xff0c; 我将另一个程序中的函数扣出来&#xff0c;通过j-flash-lite下载到MCU的一个固定地址Flash中。 2&#xff09;、然后&#xff0c; 声明一个变量为…

Elastic Stack--ELFK实例与Dashboard界面

前言&#xff1a;本博客仅作记录学习使用&#xff0c;部分图片出自网络&#xff0c;如有侵犯您的权益&#xff0c;请联系删除 学习B站博主教程笔记&#xff1a; 最新版适合自学的ElasticStack全套视频&#xff08;Elk零基础入门到精通教程&#xff09;Linux运维必备—Elastic…

低代码技术:简化应用开发,推动数字化转型

在当今快速变化的技术环境中&#xff0c;企业面临着巨大的压力&#xff0c;需要快速响应市场需求并持续推动数字化转型。传统的应用开发方式往往复杂且耗时&#xff0c;开发周期长且需要大量的编程工作。为了应对这些挑战&#xff0c;低代码技术应运而生&#xff0c;为企业提供…

oracle startup失败,ORA-01078: failure in processing system parameters

SQL> startup ORA-01078: failure in processing system parameters LRM-00109: could not open parameter file /data/oracle/product/11.2.0/db_1/dbs/initorc1.ora 出错的原因可能是&#xff1a;文件名字不正确&#xff0c;文件权限不对&#xff0c;文件不存在&#x…

嵌入式系统------ARM

目录 一.c语言回顾 1.特殊符号 &#xff08;1&#xff09;const &#xff08;2&#xff09;static &#xff08;3&#xff09;extern 2.内存的结构 &#xff08;1&#xff09;kernel&#xff1a;内核 &#xff08;2&#xff09;栈区 &#xff08;3&#xff09;堆区 &#xff08…

Mental-LLM——通过在线文本数据利用大型语言模型进行心理健康预测

概述 源码地址&#xff1a;https://github.com/neuhai/Mental-LLM.git 论文地址&#xff1a;https://arxiv.org/abs/2307.14385 在一项关于哪些法律硕士适合精神健康护理的研究中&#xff0c;对以下五种法律硕士进行了比较 羊驼-7b。羊驼-LoRA。FLAN-T5-XXLGPT-3.5GPT-4. 作…

Qt QPushButton 按钮添加数字气泡

使用场景 项目中&#xff0c;在某个按钮的右上角添加数字气泡是一个很常见的功能&#xff0c;可以用新建一个组合类来实现。不过这样比较麻烦&#xff0c;如果加气泡是后面的需求&#xff0c;可能改动的地方较多。 下面介绍2种比较简单&#xff0c;不需要改动按钮响应的方式。…

docker安装prometheus、grafana监控SpringBoot

1. 概述 最新有一个需求&#xff0c; 需要安装一个监控软件&#xff0c;对SpringBoot程序进行监控&#xff0c; 包括机器上cpu, 内存&#xff0c;jvm以及一些日志的统计。 这里需要介绍两款软件&#xff1a; prometheus 和 grafana prometheus: 中文名称&#xff0c; 普罗米…

Excel 将行和列转置的两种方法

方法一&#xff1a; 方法二&#xff1a;使用transpose公式

Unity数据持久化 之 文件操作(增删查改)

本文仅作笔记学习和分享&#xff0c;不用做任何商业用途 本文包括但不限于unity官方手册&#xff0c;unity唐老狮等教程知识&#xff0c;如有不足还请斧正​​ 这里需要弄清几个概念&#xff1a; File&#xff1a;提供文件操作的静态方法&#xff0c;是管理的 Windows.File -…

AI驱动测试管理工具会有哪些发展前景呢?

在软件测试领域&#xff0c;人工智能&#xff08;AI&#xff09;的出现犹如一场技术革命&#xff0c;改变了传统的测试管理方式。随着AI技术的迅速发展&#xff0c;它将如何进一步提升测试管理的效率与准确性&#xff1f;未来的AI驱动测试管理工具又会带来哪些令人期待的创新呢…

Postman环境变量:简化API测试的利器

引言 在当今快速发展的互联网时代&#xff0c;API&#xff08;应用程序接口&#xff09;的重要性不言而喻。无论是内部系统间的通信还是对外服务的提供&#xff0c;API都扮演着至关重要的角色。然而&#xff0c;在API的开发与测试过程中&#xff0c;经常需要处理各种各样的配置…

数学建模强化宝典(10)多元线性回归模型

一、介绍 多元线性回归模型&#xff08;Multiple Linear Regression Model&#xff09;是一种用于分析多个自变量&#xff08;解释变量、预测变量&#xff09;与单个因变量&#xff08;响应变量、被预测变量&#xff09;之间线性关系的统计模型。这种模型假设因变量的变化可以通…

ARM下汇编语言编程

一、ARM汇编语言程序格式 ARM汇编语言是以段(section)为单位来组织源文件的。段是相对独立的、具有特定名称的、不可分割的指令或者数据序列。 段又可以分为代码段和数据段&#xff0c;代码段存放执行代码&#xff0c;数据段存放代码运行时需要用到的数据。一个ARM源程序至少需…

4.1 数据分析-excel 基本操作

第四节&#xff1a;数据分析-excel 基本操作 课程目标 学会excel 基本操作 课程内容 数据伪造 产生一份招聘数据 import pandas as pd from faker import Faker import random import numpy as np# 创建一个Faker实例&#xff0c;用于生成假数据&#xff0c;指定中文本地…