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

uniapp uview 页面多个select组件回显处理,默认选中

 

 

<view class="add-item column space-around" @click="selectClick(1)"><text class="w-s-color-3 f-28">商品分类</text><view class="w-100 space-between"><!-- 第一个参数为你的单选数组,第二个参数为所需要id --><input type="text" :value="echoInputFun(categoryList,query.category_id)" placeholder="请选择" disabledplaceholder-class="phColor" class="one" /><u-icon name="arrow-right" color="#999" size="24"></u-icon></view></view><view class="add-item column space-around" @click="selectClick(2)"><text class="w-s-color-3 f-28">商品等级</text><view class="w-100 space-between"><!-- 第一个参数为你的单选数组,第二个参数为所需要id --><input type="text" :value="echoInputFun(typeList,query.type)" placeholder="请选择" disabledplaceholder-class="phColor" class="one" /><u-icon name="arrow-right" color="#999" size="24"></u-icon></view></view>

选择框 

<u-select v-model="selectShow" :default-value="defaultValue" :list="list"@confirm="confirmSelectClick"></u-select>

 select所需要的数据

selectShow: false,
list: [],
typeList: [{value: 1,label: "一级"},{value: 2,label: "二级"},{value: 3,label: "三级"}],
categoryList: [],
//记录第几个点开的select框
selectIndex: 1,
//选中的下标
defaultValue: [],
      selectClick(index) {this.selectIndex = indexif (index == 1) {this.list = this.categoryListthis.echoFun(this.query.category_id)} else {this.list = this.typeListthis.echoFun(this.query.type)}this.selectShow = true},confirmSelectClick(e) {if (this.selectIndex == 1) {this.query.category_id = e[0].value} else {this.query.type = e[0].value}},// 回显到input上面echoInputFun(list, value) {if (!value) returnlet textlist.map(item => {if (item.value == value) {text = item.label}})return text},// 回显到select表上面echoFun(value) {this.list.map((item, index) => {if (item.value == value) {this.defaultValue = [index]}})},

相关文章:

uniapp uview 页面多个select组件回显处理,默认选中

<view class"add-item column space-around" click"selectClick(1)"><text class"w-s-color-3 f-28">商品分类</text><view class"w-100 space-between"><!-- 第一个参数为你的单选数组&#xff0c;第二个…...

linux中playbook的控制语句

本章主要介绍 playbook中的控制语句。 使用 when 判断语句 block-rescue判断 循环语句 一个play中可以包含多个task&#xff0c;如果不想所有的task全部执行&#xff0c;可以设置只有满足某个 条件才执行这个task&#xff0c;不满足条件则不执行此task。本章主要讲解when 和 …...

MongoDB介绍

一、MongoDB介绍 1.1 mongoDB介绍 MongoDB 是由C语言编写的&#xff0c;是一个基于分布式文件存储的开源数据库系统。 在高负载的情况下&#xff0c;添加更多的节点&#xff0c;可以保证服务器性能。 MongoDB 旨在为WEB应用提供可扩展的高性能数据存储解决方案。 MongoDB …...

再看参数校验

作者简介&#xff1a;大家好&#xff0c;我是smart哥&#xff0c;前中兴通讯、美团架构师&#xff0c;现某互联网公司CTO 联系qq&#xff1a;184480602&#xff0c;加我进群&#xff0c;大家一起学习&#xff0c;一起进步&#xff0c;一起对抗互联网寒冬 写一个接口&#xff0c…...

计算机存储术语: 扇区,磁盘块,页

扇区(sector) 硬盘的读写以扇区为基本单位。磁盘上的每个磁道被等分为若干个弧段&#xff0c;这些弧段称之为扇区。硬盘的物理读写以扇区为基本单位。通常情况下每个扇区的大小是 512 字节。linux 下可以使用 fdisk -l 了解扇区大小&#xff1a; $ sudo /sbin/fdisk -l Disk …...

解决IDEA编译/启动报错:Abnormal build process termination

报错信息 报错信息如下&#xff1a; Abnormal build process termination: "D:\Software\Java\jdk\bin\java" -Xmx3048m -Djava.awt.headlesstrue -Djava.endorsed.dirs\"\" -Djdt.compiler.useSingleThreadtrue -Dpreload.project.path………………很纳…...

Jetpack DataStore

文章目录 Jetpack DataStore概述DataStore 对比 SP添加依赖库Preferences DataStore路径创建 Preferences DataStore获取数据保存数据修改数据删除数据清除全部数据 Proto DataStore配置AndroidStudio安装插件配置proto文件创建序列化器 创建 Proto DataStore获取数据保存数据修…...

在Portainer创建Nginx容器并部署Web静态站点实现公网访问

&#x1f525;博客主页&#xff1a; 小羊失眠啦. &#x1f3a5;系列专栏&#xff1a;《C语言》 《数据结构》 《Linux》《Cpolar》 ❤️感谢大家点赞&#x1f44d;收藏⭐评论✍️ 前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;…...

泛微e-cology XmlRpcServlet文件读取漏洞复现

漏洞介绍 泛微新一代移动办公平台e-cology不仅组织提供了一体化的协同工作平台,将组织事务逐渐实现全程电子化,改变传统纸质文件、实体签章的方式。泛微OA E-Cology 平台XmRpcServlet接口处存在任意文件读取漏洞&#xff0c;攻击者可通过该漏洞读取系统重要文件 (如数据库配置…...

当下流行的直播技术demo演示

nginx-http-flv-module&#xff08;更新不是很频繁&#xff09; SRS: https://ossrs.net/lts/zh-cn/&#xff08;独立官网&#xff0c;目前最新稳定版version5&#xff09; 基于SRS搭建直播demo演示&#xff1a; 一、搭建流媒体服务器 参见官网&#xff1a;https://ossrs.ne…...

Zabbix自动发现并注册已安装agent的主机

先在被监控主机上安装好zabbix-agent 然后登录zabbix网页 点击发现动作后会出现第三步 然后编辑操作&#xff0c;发现后加入到主机组群 然后编辑发现规则 然后就可以在主机列表中看到被发现的主机。...

Jtti:linux搭建开源ldap服务器的方法

搭建开源LDAP服务器是一种用于集中管理用户身份认证和授权信息的方法。在Linux系统上&#xff0c;OpenLDAP是一个流行的开源LDAP实现&#xff0c;可以用于搭建LDAP服务器。以下是搭建OpenLDAP服务器的基本步骤&#xff1a; 步骤一&#xff1a;安装OpenLDAP 安装OpenLDAP软件包&…...

Gazebo GUI模型编辑器

模型编辑器 现在我们将构建我们的简单机器人。我们将制作一个轮式车辆&#xff0c;并添加一个传感器&#xff0c;使我们能够让机器人跟随一个斑点&#xff08;人&#xff09;。 模型编辑器允许我们直接在图形用户界面 &#xff08;GUI&#xff09; 中构建简单的模型。对于更复…...

pycharm运行正常,但命令行执行提示module不存在的多种解决方式

问题描述 在执行某个测试模块时出现提示&#xff0c;显示自定义模块data不存在&#xff0c;但是在PyCharm下运行正常。错误信息如下&#xff1a; Traceback (most recent call last):File "/run/channelnterface-autocase/testcases/test_chanel_detail.py", line 2…...

GBASE南大通用GBase 8a ODBC的安装文件

GBASE南大通用GBase 8a ODBC 体系结构是基于五个组件&#xff0c;在下图中所示&#xff1a; GBase 8a ODBC 体系结构图  应用 应用是通过调用 ODBC API 实现对 GBase 数据访问的程序。应用使用标准的 ODBC 调用与驱动程序管理器通信。应用并不关心数据存储在哪里&#xff…...

重新配置torch1.8 cuda11.1 torchtext0.9.0虚拟Pytorch开发环境

这里写目录标题 起因发现选择安装cuda 11.1核对下自己的显卡是否支持下载该版本的CUDACUDA下载地址CUDA安装过程 在anaconda中创建一个虚拟环境1.以下是环境的配置过程2.查看虚拟环境列表3.激活虚拟环境 安装torch和torchtext包的过程1.输入下面这句代码&#xff0c;就可以直接…...

【动画图解】一次理清九大排序算法!面试官问到再也不慌!

排序算法 交换排序 冒泡排序快速排序 插入排序 直接插入排序希尔排序 选择排序 简单选择排序堆排序 归并排序基数排序桶排序 一、冒泡排序 冒泡排序是一种简单的交换排序算法&#xff0c;以升序排序为例&#xff0c;其核心思想是&#xff1a; 从第一个元素开始&#xff0c…...

组播地址段及其作用

作用 组播(Multicast)传输:在发送者和每一接收者之间实现点对多点网络连接。如果一台发送者同时给多个的接收者传输相同的数据&#xff0c;也只需复制一份的相同数据包。它提高了数据传送效率。减少了骨干网络出现拥塞的可能性。 地址段 组播协议的地址在 IP 协议中属于 D 类…...

Vue+ElementUI前端添加展开收起搜索框按钮

1、搜索框添加判断 v-if"advanced" <el-form-item label"创建日期" v-if"advanced"><el-date-pickerv-model"daterangeLedat"size"small"style"width: 240px"value-format"yyyy-MM-dd"type&q…...

速盾网络:sdk游戏盾有什么作用?

速盾cdn是一款非常优秀的CDN加速服务&#xff0c;它能够帮助游戏开发者们提升游戏的性能和稳定性。其中&#xff0c;速盾cdn的sdk游戏盾是其一项非常实用的功能&#xff0c;它能够为游戏提供更加稳定和快速的网络连接。 首先&#xff0c;让我们来了解一下什么是sdk游戏…...

多智能体协作四大架构模式:Subagents/Skills/Handoffs/Router完全指南

← 上一篇&#xff1a;AI大模型3月终局&#xff1a;商业化转向、智能体崛起与安全红线 → 下一篇&#xff1a;大模型推理加速2026&#xff1a;从500ms到80ms的完整优化路径 摘要 当单个 AI Agent 无法高效处理复杂任务时&#xff0c;多智能体系统&#xff08;Multi-Agent Sys…...

从RS485到TCP/IP:Modbus协议V1.1b3的三种组网方式对比(含WireShark抓包分析)

从RS485到TCP/IP&#xff1a;Modbus协议V1.1b3的三种组网方式深度实战解析 在工业自动化领域&#xff0c;Modbus协议已经服役超过40年&#xff0c;却依然保持着惊人的生命力。作为工程师&#xff0c;我们常常面临一个关键抉择&#xff1a;在RS485、Modbus和TCP/IP这三种主流组…...

WarcraftHelper:魔兽争霸3终极优化指南 - 解锁现代硬件性能

WarcraftHelper&#xff1a;魔兽争霸3终极优化指南 - 解锁现代硬件性能 【免费下载链接】WarcraftHelper Warcraft III Helper , support 1.20e, 1.24e, 1.26a, 1.27a, 1.27b 项目地址: https://gitcode.com/gh_mirrors/wa/WarcraftHelper WarcraftHelper是一款专为魔兽…...

ai辅助开发comfyui:让快马ai成为你构建复杂工作流的智能编程伙伴

最近在折腾ComfyUI时&#xff0c;发现构建复杂工作流特别容易卡在细节问题上。比如想同时用Canny边缘检测和Openpose控制生成效果&#xff0c;光是调试节点连接和参数就花了大半天。后来尝试用InsCode(快马)平台的AI辅助功能&#xff0c;发现能省下不少重复劳动。这里分享下用A…...

MacOS开发环境配置:OpenClaw+GLM-4.7-Flash联调指南

MacOS开发环境配置&#xff1a;OpenClawGLM-4.7-Flash联调指南 1. 为什么选择这个组合&#xff1f; 去年我在做一个自动化文档处理项目时&#xff0c;发现市面上的AI工具要么隐私性不足&#xff0c;要么灵活性太差。直到偶然接触到OpenClaw这个开源框架&#xff0c;才找到了理…...

终极指南:如何使用LeetDown轻松降级A6/A7苹果设备系统

终极指南&#xff1a;如何使用LeetDown轻松降级A6/A7苹果设备系统 【免费下载链接】LeetDown a GUI macOS Downgrade Tool for A6 and A7 iDevices 项目地址: https://gitcode.com/gh_mirrors/le/LeetDown LeetDown是一款专为macOS设计的图形化降级工具&#xff0c;能够…...

深入OpenBMC构建系统:Yocto项目与BitBake实战解析(以Romulus平台为例)

深入OpenBMC构建系统&#xff1a;Yocto项目与BitBake实战解析&#xff08;以Romulus平台为例&#xff09; 在服务器硬件管理领域&#xff0c;OpenBMC作为开源基板管理控制器固件堆栈&#xff0c;正逐渐成为企业级设备的标准配置。不同于简单的固件烧录&#xff0c;OpenBMC的构建…...

告别卡顿!用UE5关卡流送(Level Streaming)优化你的开放世界游戏性能

告别卡顿&#xff01;用UE5关卡流送&#xff08;Level Streaming&#xff09;优化你的开放世界游戏性能 当玩家在广袤的开放世界中自由探索时&#xff0c;没有什么比突然的加载卡顿或帧率骤降更能破坏沉浸感了。作为UE5开发者&#xff0c;我们常常面临一个两难选择&#xff1a;…...

AI虚拟员工平台完整搭建教程:从源码获取到正式上线,全流程记录

温馨提示&#xff1a;文末有资源获取方式最近AI赛道又火了一个新方向&#xff0c;很多人都在讨论&#xff0c;但真正能用起来的没几个。技术门槛摆在那&#xff0c;普通用户想上手确实不容易。今天这篇教程&#xff0c;我把从源码部署到正式上线的完整过程整理出来&#xff0c;…...

从.bib到.bbl:手把手教你搞定LaTeX参考文献的完整流程

从.bib到.bbl&#xff1a;手把手教你搞定LaTeX参考文献的完整流程 如果你曾被LaTeX的参考文献格式折磨得焦头烂额&#xff0c;这篇文章就是为你准备的。我们将从零开始&#xff0c;完整走一遍从文献管理到最终PDF生成的每个步骤&#xff0c;特别关注那些让新手困惑的.bib、.bbl…...