【Vue-Element-Admin】级联查询

背景

有两个查询条件:模块、功能点
想实现选择模块后,点击功能点下拉框,查询出对应模块下的功能点列表

查询

listQuery:

export default{return{listQuery:{//page:1,//limit:20,//如果想兼容按条件导出,可以定义查询条件age:undefined,sex:undefined},moduleOptions:null,functionPointOptions:null}
}
getModuleList(){return findModuleList(this.listQuery).then(response=>{this.moduleOptions=response.data['items']})
},
getFunctionPointList(){return findFunctionPointList(this.listQuery).then(response=>{this.functionPointOptions=response.data['items']})
}

级联查询

<template>	<el-form-item label="级联查询" prop="search"><el-select v-model="listQuery.module" placeholder="模块" filterable remote :remote-method="getModuleList" clearable @focus="(event)=>getModuleList()" style="width: 100%"><el-option v-for="item in moduleOptions" :key="item" :label="item" :value="item" /></el-select><el-select v-model="listQuery.function_point" placeholder="模块" filterable remote :remote-method="getFunctionPointList" clearable @focus="(event)=>getFunctionPointList()" style="width: 100%"><el-option v-for="item in functionPointOptions" :key="item" :label="item" :value="item" /></el-select></el-form-item>
</template>

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

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

相关文章

K8s 多集群实践思考和探索

作者&#xff1a;vivo 互联网容器团队 - Zhang Rong 本文主要讲述了一些对于K8s多集群管理的思考&#xff0c;包括为什么需要多集群、多集群的优势以及现有的一些基于Kubernetes衍生出的多集群管理架构实践。 一、为什么需要多集群 随着K8s和云原生技术的快速发展&#xff0c…

echarts条形图实现颜色渐变

eCharts——柱状图中的柱体颜色渐变_echarts 柱状图渐变_小美同学的博客-CSDN博客 【Echarts】柱状图渐变两种实现方式_echarts柱状图渐变_芳草萋萋鹦鹉洲哦的博客-CSDN博客

将 Spring Boot 应用程序与 Amazon DocumentDB 集成

Amazon DocumentDB&#xff08;与 MongoDB 兼容&#xff09;是一种可扩展、高度持久和完全托管的数据库服务&#xff0c;用于操作任务关键型 MongoDB 工作负载。在 Amazon DocumentDB 上&#xff0c;您可以使用相同的 MongoDB 应用程序代码、驱动程序和工具来运行、管理和扩展工…

学习笔记|回顾(1-12节课)|应用模块化的编程|添加函数头|静态变量static|STC32G单片机视频开发教程(冲哥)|阶段小结:应用模块化的编程(上)

文章目录 1.回顾(1-12节课)2.应用模块化的编程(.c .h)Tips:添加函数头创建程序文件三步引脚定义都在.h文件函数定义三步bdata位寻址变量的使用 3.工程文件编写静态变量static的使用完整程序为&#xff1a;demo.c&#xff1a;seg_led.c:seg_led.h: 1.回顾(1-12节课) 一、认识单…

文件上传漏洞-upload靶场13-16关 (图片木马-文件包含与文件上次漏洞)

文件上传漏洞-upload靶场13-16关 &#xff08;图片木马-文件包含与文件上次漏洞&#xff09; 简介 upload靶场到了第十三关&#xff0c;难度就直线上升了&#xff0c;在最后这7关中&#xff0c;包含了图片木马、竞争条件等上传技巧&#xff0c;这些漏洞的本质&#xff0c;都是…

重复的DNA序列(力扣)JAVA

DNA序列 由一系列核苷酸组成&#xff0c;缩写为 ‘A’, ‘C’, ‘G’ 和 ‘T’.。 例如&#xff0c;“ACGAATTCCG” 是一个 DNA序列 。 在研究 DNA 时&#xff0c;识别 DNA 中的重复序列非常有用。 给定一个表示 DNA序列 的字符串 s &#xff0c;返回所有在 DNA 分子中出现不止…

Vite,Vue3项目引入dataV报错的解决方法

背景:开发一个大屏项目中,需要是要DataV的那边边框,装饰等,只是DataV是基于vue2的,vue3版的作者还在开发中,于是翻了DataV的源码,发现使用esm方式时是直接引入源码而不经过打包,其源码中使用的vue语法vue3也支持,所以可以直接在vue3中引入使用. vite,vue3项目直接引入DataV 安…

Upload-labs 1~15 通关详细教程

文章目录 Upload-labs 1~15 通关详细教程Pass-01-前端js验证Pass-02-后端MIME验证Pass-03-黑名单验证Pass-04-黑名单验证.htaccessPass-05-文件后缀名大小写绕过Pass-06-文件后缀名空格绕过Pass-07-文件后缀名点绕过Pass-08-文件后缀名::$DATA绕过Pass-09-点空格点空格绕过Pass…

《Market Insight:中国低代码/零代码市场发展洞察 ( 2023 )》报告正式发布 | LowCode低码时代

数字化浪潮下&#xff0c;低代码/零代码通过提升“开发生产力”将极大促进技术应用效率和产业数字化进程。目前中国的低代码/零代码在制造业、政务与公共事业、金融、电商等领域取得了一定的应用成效。而伴随着生成式AI技术的应用突破&#xff0c;低代码/零代码市场又将迎来新的…

【前端】React项目初体验

React介绍 React 是一个非常流行的 JavaScript 前端框架&#xff0c;它为开发人员提供了一种快速构建高质量用户界面的方式。以下是使用 React 构建项目的初体验&#xff1a; 安装 React 和相关依赖项 使用 React 开发项目需要先安装一些必需的依赖项&#xff0c;包括 Node.…

快速掌握STM32工程创建

STM32 工程创建-- 使用Keil uVision5 软件 晓理紫 1 准备库函数库 STM32F10x_StdPeriph_Lib_V3.5.0 VX 搜索“晓丽紫”关注回复STM32F10x即可下载 2、创建一个目录用来存放工程 STM32Study STM32Study/study1 存放本次工程目录 3、打开Keil uVision5 创建工程 4、选择型号(根据…

【用unity实现100个游戏之9】使用Unity制作类八方旅人、饥荒风格的俯视角2.5D游戏

前言 2.5D游戏 是一种介于二维和三维之间的游戏形式。它通常在二维平面上展示游戏内容&#xff0c;但利用三维技术来实现更加逼真的图像效果。 在2.5D游戏中&#xff0c;角色和环境通常是以平面的形式呈现&#xff0c;但可以在垂直方向上移动。这意味着玩家可以在一个相对较薄…

对话永洪科技CEO何春涛:专注BI,决胜AI时代丨数据猿专访

大数据产业创新服务媒体 ——聚焦数据 改变商业 大数据、云计算、人工智能为代表的新一代信息技术走向普及&#xff0c;数据驱动业务&#xff0c;逐渐成为现代化企业管理、运作的日常。对于年均复合增长率超过20%的国内商业智能&#xff08;BI&#xff09;市场而言&#xff0c…

编译KArchive在windows10下

使用QT6和VS2019编译KArchive的简要步骤&#xff1a; 安装 Qt &#xff0c;我是用源码自己编译的 "F:\qtbuild"安装CMakefile并配置环境变量安装Git下载ECM源码 https://github.com/KDE/extra-cmake-modules.git-------------------------------------------------…

lintcode 1840 · 矩阵还原【中等 vip 二维前缀和数组】

题目 https://www.lintcode.com/problem/1840 现有一个n行m列的矩阵 before&#xff0c;对于before里的每一个元素 before[i][j]&#xff0c;我们会使用以下算法将其转化为 after[i][j]。现给定after矩阵&#xff0c;请还原出原有的矩阵before。s 0 for i1: 0 -> ifor j1…

运筹系列85:求解大规模tsp问题的julia代码

1. 大规模tsp问题的挑战 数学模型和精确解法见《运筹系列65&#xff1a;TSP问题的精确求解法概述》和《运筹系列80:使用Julia精确求解tsp问题》&#xff1a; variable(m, x[1:n,1:n], Bin,Symmetric) # 0-1约束 objective(model, Min, sum(x.*distmat)/2) constraint(model, …

计算机视觉的应用13-基于SSD模型的城市道路积水识别的应用项目

大家好&#xff0c;我是微学AI&#xff0c;今天给大家介绍一下计算机视觉的应用13-基于SSD模型的城市道路积水识别的应用项目。今年第11号台风“海葵”后部云团的影响&#xff0c;福州地区的降雨量突破了历史极值&#xff0c;多出地方存在严重的积水。城市道路积水是造成交通拥…

javaee之黑马乐优商城2

简单分析一下商品分类表的结构 先来说一下分类表与品牌表之间的关系 再来说一下分类表和品牌表与商品表之间的关系 面我们要开始就要创建sql语句了嘛&#xff0c;这里我们分析一下字段 用到的数据库是heima->tb_category这个表 现在去数据库里面创建好这张表 下面我们再去编…

Unexpected mutation of “xxxx“ prop

原因 是因为子级修改了父级的数据&#xff0c;所以eslint执行的时候报了这个错 修复方式 1 如果是弹窗等组件&#xff0c;可以根据功能进行修改&#xff0c;比如我这块用的 element ui 的 dialog&#xff0c;便可以改成这样 使用 model-value 代替 修复方式 2 新建子组件…

3种等待方式,让你学会Selenium设置自动化等待测试脚本!

一、Selenium脚本为什么要设置等待方式&#xff1f;——即他的应用背景到底是什么 应用Selenium时&#xff0c;浏览器加载过程中无法立即显示对应的页面元素从而无法进行元素操作&#xff0c;需设置一定的等待时间去等待元素的出现。&#xff08;简单来说&#xff0c;就是设置…