当前位置: 首页 > news >正文

el-select下拉框 change事件返回该项所有数据

 主要代码 value-key

<template><div><el-selectv-model="value"value-key="label"placeholder="请选择"@change="selectChange"><el-optionv-for="item in options":key="item.label":label="item.label":value="item"></el-option></el-select></div>
</template><script>
export default {data() {return {options: [{value: "选项1",label: "黄金糕",},{value: "选项2",label: "双皮奶",},{value: "选项3",label: "蚵仔煎",},{value: "选项4",label: "龙须面",},{value: "选项5",label: "北京烤鸭",},],value: "",};},mounted() {},methods: {selectChange(item) {console.log(item);},},
};
</script><style scoped></style>

 以下暂时自行理解,需与后端对接(有时间在整理)。。。。。

1. input 远程搜索
 <el-autocompletestyle="width: 100%"v-model="form.ENTNAME":fetch-suggestions="querySearchAsync"placeholder="企业名称"@select="handleSelect"clearablevalue-key="ENTAME"></el-autocomplete>querySearchAsync(query, callBack) {if (query!== "") {this.$http.post("/system/ssoloin/getUrlataMap", {method: "getEntByword",token: getToken(),mapData: { type: "0", keyword: query},}).then((res) => {callBack(res.data.data.RESULTDATA);});}},handleSelect(item) {this.$http.post("/syem/ssolon/getUrltap", {method: "getRegistnfo",token: getToken(),mapData: { type: "0", keyWord: item.ENTNAME },}).then((res) => {this.form = res.data.data.RESTDATA[0];});},

 2. select 远程搜索

<el-selectv-model="form.ENTNAME"filterableremotereserve-keywordplaceholder="请输入企业名称":remote-method="remoteMethod":loading="loading"style="width: 100%"@change="selectChange"><el-optionv-for="(item, index) in options":key="index":label="item.ENTNAME":value="item.ENTNAME"></el-option></el-select>remoteMethod(query) {if (query !== "") {this.loading = true;this.$http.post("/syst/ssgin/getUrlaMap", {method: "getEyKeyord",token: getToken(),mapData: { type: "0", keyword: query },}).then((res) => {this.loading = false;this.options = res.data.data.RESUDTA;});} else {this.options = [];}},selectChange(value) {this.$http.post("/syem/ssogin/getUrlDaMap", {method: "getRegierInfo",token: getToken(),mapData: { type: "0", keyWord: value},}).then((res) => {this.form = res.data.data.RESULATA[0];});},

相关文章:

el-select下拉框 change事件返回该项所有数据

主要代码 value-key <template><div><el-selectv-model"value"value-key"label"placeholder"请选择"change"selectChange"><el-optionv-for"item in options":key"item.label":label"…...

MySQL基础篇(一)SQL

视频地址: 黑马程序员 MySQL数据库入门到精通&#xff0c;从mysql安装到mysql高级、mysql优化全囊括 SQL&#xff0c;全称 Structured Query Language&#xff0c;结构化查询语言。操作关系型数据库的编程语言&#xff0c;定义了一套操作关系型数据库统一 标准。 一、SQL通用语…...

多类指针式仪表自动读数系统的LabVIEW开发应用案例

多类指针式仪表自动读数系统的LabVIEW开发应用案例 工业环境中&#xff0c;多类指针式仪表的自动读数一直是一个具有挑战性的问题。本案例旨在展示如何使用LabVIEW开发一个高度智能化的多类指针式仪表自动读数系统&#xff0c;以应对复杂的工业环境。通过结合图像处理技术和深…...

攀登者2 - 华为OD统一考试

OD统一考试 分值: 200分 题解: Java / Python / C++ 题目描述 攀登者喜欢寻找各种地图,并且尝试攀登到最高的山峰。 地图表示为一维数组,数组的索引代表水平位置,数组的元素代表相对海拔高度。其中数组元素0代表地面。 例如:[0,1,2,4,3,1,0,0,1,2,3,1,2,1,0],代表如下…...

归并排序例题——逆序对的数量

做道简单一点的题巩固一下 归并排序实现步骤 将整个区间 [l, r] 划分为 [l, mid] 和 [mid1, r]。 递归排序 [l, mid] 和 [mid1, r]。 将左右两个有序序列合并为一个有序序列。 题目描述 给定一个长度为 n 的整数数列&#xff0c;请计算数列中的逆序对的数量。 逆序对的定义…...

数据库连接使用问题 - 1

原理 open-in-view 是 Spring Boot ⾃动加载 Spring Data JPA 提供的⼀个配置&#xff0c;全称为 spring.jpa.open-in-viewtrue&#xff0c;它只有 true 和 false 两个值&#xff0c;默认是 true。 这个配置为true时&#xff0c;会导致Web MVC请求处理的一开始&…...

【已解决】You have an error in your SQL syntax

报错讯息 java.sql.SQLSyntaxErrorException: You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near ‘desc,target_url,sort,status,create_by,modify_by,created,last_update_time FROM…...

如何在Ubuntu安装SVN服务并结合cpolar实现公网TCP地址远程访问本地服务

文章目录 前言1. Ubuntu安装SVN服务2. 修改配置文件2.1 修改svnserve.conf文件2.2 修改passwd文件2.3 修改authz文件 3. 启动svn服务4. 内网穿透4.1 安装cpolar内网穿透4.2 创建隧道映射本地端口 5. 测试公网访问6. 配置固定公网TCP端口地址6.1 保留一个固定的公网TCP端口地址6…...

windows监控进程是否还活着,查看内存使用率

windows监控进程是否还活着&#xff0c;查看内存使用率 1、导入库psutil pip install psutil2、查看进程是否活着 def is_process_running(self, process_name):# 查看程序是否还存活for process in psutil.process_iter():try:if process.name() process_name:return True…...

C#-词法结构

程序 C# 程序 (program) 由一个或多个源文件 (source file) 组成,源文件的正式名称是编译单元 (compilation unit)。源文件是有序的 Unicode 字符序列。 源文件与文件系统中的文件通常具有一对一的对应关系,但这种对应关系不是必需的。为实现可移植性的最大化,建议这些文件…...

GitHub pull request(傻瓜式入门版)

GitHub pull request Pull Request&#xff08;拉取请求&#xff09;是一种非常重要的协作机制&#xff0c;它是 Git 和 GitHub 等代码托管平台中常见的功能。在开源项目中&#xff0c;Pull Request 被广泛用于参与社区贡献&#xff0c;从而促进项目的发展。 一、fork代码 先…...

Studio 3T客户端连接Mongodb数据库服务

这里需要注意 一定要先开Studio 3T 到 创建连接时才开Mongodb服务 不然 Studio 3T 会找不到Mongodb服务 不知道这是不是 Studio 3T官方问题 期待解决吧 我们打开 Studio 3T 然后点击 Create a new connection 开始创建连接 新弹出的窗口中选择 Manually configure my connec…...

算法每日一题:赎金信 | 字符和整数

hello&#xff0c;大家好&#xff0c;我是星恒 今天给大家带来的题目是一道简单题目&#xff0c;主要帮大家复习一下字符串和字符的相关操作 给你两个字符串&#xff1a;ransomNote 和 magazine &#xff0c;判断 ransomNote 能不能由 magazine 里面的字符构成。如果可以&#…...

数字孪生在虚拟现实(VR)中的应用

数字孪生在虚拟现实&#xff08;VR&#xff09;中的应用为用户提供了更深入、沉浸式的体验&#xff0c;同时通过数字孪生技术模拟真实世界的物理实体。以下是数字孪生在VR中的一些应用&#xff0c;希望对大家有所帮助。北京木奇移动技术有限公司&#xff0c;专业的软件外包开发…...

iOS实时查看App运行日志

目录 一、设备连接 二、使用克魔助手查看日志 三、过滤我们自己App的日志 &#x1f4dd; 摘要&#xff1a; 本文介绍了如何在iOS iPhone设备上实时查看输出在console控制台的日志。通过克魔助手工具&#xff0c;我们可以连接手机并方便地筛选我们自己App的日志。 &#x1f4…...

论文阅读:通过时空生成卷积网络合成动态模式(重点论文)

原文链接 github code 介绍视频 视频序列包含丰富的动态模式&#xff0c;例如在时域中表现出平稳性的动态纹理模式&#xff0c;以及在空间或时域中表现出非平稳的动作模式。 我们证明了时空生成卷积网络可用于建模和合成动态模式。 该模型定义了视频序列上的概率分布&#xff0…...

html2canvas+jsPDF导出超长网页的PDF

项目需求:有一个网页大概60000px的高度,现在需要导出为PDF index.vue <template><div class"ctn"><div class"pdf-ctn"><div class"pdf-panel" ><div class"pdf-inside-panel" id"myList">&…...

云计算:OpenStack 分布式架构管理VXLAN网络(单控制节点与多计算节点)

目录 一、实验 1.环境 2.各节点新增网卡准备VXLAN网络 3.控制节点配置私有网络 4.计算节点1配置私有网络 5.计算节点2配置私有网络 6.重启服务 7.修改Dashboard 8.新建项目&#xff08;租户&#xff09;及用户 9.新建网络与子网 10.新建实例 11.新建路由 12.新增浮…...

MATLAB --- dlmread( )函数的用法

dlmread() 是 MATLAB 中用于读取以特定分隔符分隔的文本文件数据的函数 下面是 dlmread() 函数的用法&#xff1a; M dlmread(filename) M dlmread(filename, delimiter) M dlmread(filename, delimiter, R, C) M dlmread(filename, delimiter, range)参数说明&#xff1…...

STM32CubeMX RS485接口使用

一、基本知识 TTL&#xff08;Transistor-Transistor Logic&#xff09;&#xff1a; 电平范围&#xff1a; 逻辑1对应于2.4V–5V&#xff0c;逻辑0对应于0V–0.5V。通信特点&#xff1a; 全双工。特点&#xff1a; 常见于单片机和微控制器的IO电平&#xff0c;USB转TTL模块通常…...

conda相比python好处

Conda 作为 Python 的环境和包管理工具&#xff0c;相比原生 Python 生态&#xff08;如 pip 虚拟环境&#xff09;有许多独特优势&#xff0c;尤其在多项目管理、依赖处理和跨平台兼容性等方面表现更优。以下是 Conda 的核心好处&#xff1a; 一、一站式环境管理&#xff1a…...

Spark 之 入门讲解详细版(1)

1、简介 1.1 Spark简介 Spark是加州大学伯克利分校AMP实验室&#xff08;Algorithms, Machines, and People Lab&#xff09;开发通用内存并行计算框架。Spark在2013年6月进入Apache成为孵化项目&#xff0c;8个月后成为Apache顶级项目&#xff0c;速度之快足见过人之处&…...

智能在线客服平台:数字化时代企业连接用户的 AI 中枢

随着互联网技术的飞速发展&#xff0c;消费者期望能够随时随地与企业进行交流。在线客服平台作为连接企业与客户的重要桥梁&#xff0c;不仅优化了客户体验&#xff0c;还提升了企业的服务效率和市场竞争力。本文将探讨在线客服平台的重要性、技术进展、实际应用&#xff0c;并…...

【Go】3、Go语言进阶与依赖管理

前言 本系列文章参考自稀土掘金上的 【字节内部课】公开课&#xff0c;做自我学习总结整理。 Go语言并发编程 Go语言原生支持并发编程&#xff0c;它的核心机制是 Goroutine 协程、Channel 通道&#xff0c;并基于CSP&#xff08;Communicating Sequential Processes&#xff0…...

第一篇:Agent2Agent (A2A) 协议——协作式人工智能的黎明

AI 领域的快速发展正在催生一个新时代&#xff0c;智能代理&#xff08;agents&#xff09;不再是孤立的个体&#xff0c;而是能够像一个数字团队一样协作。然而&#xff0c;当前 AI 生态系统的碎片化阻碍了这一愿景的实现&#xff0c;导致了“AI 巴别塔问题”——不同代理之间…...

深入解析C++中的extern关键字:跨文件共享变量与函数的终极指南

&#x1f680; C extern 关键字深度解析&#xff1a;跨文件编程的终极指南 &#x1f4c5; 更新时间&#xff1a;2025年6月5日 &#x1f3f7;️ 标签&#xff1a;C | extern关键字 | 多文件编程 | 链接与声明 | 现代C 文章目录 前言&#x1f525;一、extern 是什么&#xff1f;&…...

【HTTP三个基础问题】

面试官您好&#xff01;HTTP是超文本传输协议&#xff0c;是互联网上客户端和服务器之间传输超文本数据&#xff08;比如文字、图片、音频、视频等&#xff09;的核心协议&#xff0c;当前互联网应用最广泛的版本是HTTP1.1&#xff0c;它基于经典的C/S模型&#xff0c;也就是客…...

Fabric V2.5 通用溯源系统——增加图片上传与下载功能

fabric-trace项目在发布一年后,部署量已突破1000次,为支持更多场景,现新增支持图片信息上链,本文对图片上传、下载功能代码进行梳理,包含智能合约、后端、前端部分。 一、智能合约修改 为了增加图片信息上链溯源,需要对底层数据结构进行修改,在此对智能合约中的农产品数…...

初探Service服务发现机制

1.Service简介 Service是将运行在一组Pod上的应用程序发布为网络服务的抽象方法。 主要功能&#xff1a;服务发现和负载均衡。 Service类型的包括ClusterIP类型、NodePort类型、LoadBalancer类型、ExternalName类型 2.Endpoints简介 Endpoints是一种Kubernetes资源&#xf…...

R语言速释制剂QBD解决方案之三

本文是《Quality by Design for ANDAs: An Example for Immediate-Release Dosage Forms》第一个处方的R语言解决方案。 第一个处方研究评估原料药粒径分布、MCC/Lactose比例、崩解剂用量对制剂CQAs的影响。 第二处方研究用于理解颗粒外加硬脂酸镁和滑石粉对片剂质量和可生产…...