使用uniapp 微信小程序一些好用的插件分享

总结一下自己在开发中遇见的一问题,通过引入组件可以快速的解决

 1.zxz-uni-data-select  下拉框选择器(添加下拉框检索,多选功能,多选搜索功能,自定义

下拉框插件,使用这个的原因是因为 uniui  uview  组件库下拉框太难用了,返回的数据每次都需要map 转换数据,真的麻烦,要不就不支持搜索,可以自定义绑定的数据,这个插件可以解决大部分的问题

地址:zxz-uni-data-select 下拉框选择器(添加下拉框检索,多选功能,多选搜索功能,自定义 - DCloud 插件市场

2.  z-paging-x下拉刷新、上拉加载

主要的作用就是一个列表分页加载的效果,uniapp 也有对应的api,如果每一个页面都写,比较麻烦

使用很简单   <z-paging ref="paging" @query="queryList">   绑定queryList  这个方法就可以了,在这个里面调用接口了,不需要在onLoad中调用接口了, 需要注意数据去重

注意: pageNo   pageSize  根据自己接口请求修改

演示代码如下:

<template><z-paging ref="paging" @query="queryList"><view class="box"><view class="box-item" v-for="item in listData" :key="item.id" @click="detail(item)"><view><view class="center">项目编号:{{item.itemNumber}}</view><view class="center">委托单位:{{item.entrustUnit}}</view><view class="center">项目/线路名称:{{item.itemName}}</view><view class="center">检测日期:{{item.checkDate}}</view><view class="center">交付日期:{{item.deliveryDate}}</view><view class="center">检测数量:{{item.detectionQuantity}}</view><view class="center">细分产品:{{item.segmentedProduct}}</view></view><u-icon name="arrow-right"></u-icon></view></view></z-paging>
</template><script>import {$listDelivery} from '@/api/testingManagement/projectDelivery.js'export default {data() {return {listData:[],}},created() {},methods: {detail(item){this.$tab.navigateTo(`/workpages/projectDelivery/index?id=${item.id}`);},queryList(pageNo, pageSize) {$listDelivery({pageNum: pageNo,pageSize}).then(res => {this.$refs.paging.complete(res.rows);const newRows = res.rows;const seenServiceIds = new Set(this.listData.map(item => item.id));const filteredRows = newRows.filter(item => {if (!seenServiceIds.has(item.id)) {seenServiceIds.add(item.id);  return true;  }return false; });this.listData = [...this.listData, ...filteredRows];}).catch(res => {this.$refs.paging.complete(false);})}}}
</script>

地址:【z-paging-x下拉刷新、上拉加载】z-paging uniappx版已上线! - DCloud 插件市场

3. xm-cascader  级联选择器 cascader 部门选择器 可选择任意一级

使用这个的原因是 uniui 级联选择器无法选择任意一级,用这个就解决了

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

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

相关文章

腾讯云AI代码助手编程挑战赛-有趣的冷知识分享

作品简介 有趣的冷知识这一编程主要用于对于小朋友的探索力的开发&#xff0c;让小朋友在一开始就对学习具有探索精神。在信息化时代下&#xff0c;会主动去学习自己认知以外的知识&#xff0c;同时丰富了眼界&#xff0c;开拓了新的知识。 技术架构 使用python语言的TK库…

使用 SQL 和表格数据进行问答和 RAG(7)—将表格数据(CSV 或 Excel 文件)加载到向量数据库(ChromaDB)中

将表格数据&#xff08;CSV 或 Excel 文件&#xff09;加载到向量数据库&#xff08;ChromaDB&#xff09;中。这里定义的类 PrepareVectorDBFromTabularData&#xff0c;它的主要功能是读取表格数据文件到DataFrame中、生成嵌入向量、并将这些数据存储在向量数据库的集合中&am…

攻防世界 wtf.sh-150

点进去&#xff0c;发现是一个类似于论坛的网站&#xff0c;并且对报错等做了处理 用御剑扫描一下 ​ 发现是php形式的文件&#xff0c;但点进去访问不了。看看wp&#xff0c;发现此题存在路径穿越漏洞&#xff0c;就是&#xff08;如果应用程序使用用户可控制的数据&#xff0…

【Spring】Redis缓存+ehcache

文章目录 基于Spring的RedisehcacheRedis 缓存配置Cacheable 注解CacheEvict 注解缓存配置 基于Spring的Redisehcache Redis 缓存配置 在项目中添加 Redis 的依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot…

UE5 打包要点

------------------------- 1、需要环境 win sdk &#xff0c;大约3G VS&#xff0c;大约10G 不安装就无法打包&#xff0c;就是这么简单。 ----------------------- 2、打包设置 编译类型&#xff0c;开发、调试、发行 项目设置-地图和模式&#xff0c;默认地图 项目…

小程序textarea组件键盘弹起会遮挡住输入框

<textarea value"{{remark}}" input"handleInputRemark" ></textarea> 如下会有遮挡&#xff1a; 一行代码搞定 cursor-spacing160 修改后代码 <textarea value"{{remark}}" input"handleInputRemark" cursor-spacin…

git的rebase和merge的区别?

B分支从A分支拉出 1.git merge 处于A分支执行&#xff0c;git merge B分支:相当于将commit X、commit Y两次提交&#xff0c;作为了新的commit Z提交到了A分支上。能溯源它真正提交的信息。 2.git rebase 处于B分支&#xff0c;执行git rebase A分支&#xff0c;B分支那边复…

Cadence——virtuous生成的symbol其端口自动添加注释

新换的工艺库&#xff0c;环境变量也会发生变化&#xff0c;毕竟每一家PDK下的.cdsinit 和 .cdsenv文件不尽相同。 这次新换的PDK&#xff0c;搭建完Schcematic之后&#xff0c;再生成的Symbol&#xff0c;发现其pin口&#xff0c;也就是端口没有自动生成注释&#xff0c;我就…

CClinkIEfield Basic转Modbus TCP网关模块连接三菱FX5U PLC

捷米特JM-CCLKIE-TCP是自主研发的一款CCLINK IE FB从站功能的通讯网关。该产品主要功能是将各种 MODBUS-TCP 设备接入到 CCLINK IE FB网络中。 捷米特JM-CCLKIE-TCP网关连接到CCLINK IE FB总线中做为从站使用&#xff0c;连接到 MODBUS-TCP 总线中做为主站或从站使用。 为了打破…

《分布式光纤测温:解锁楼宇安全的 “高精度密码”》

在楼宇建筑中&#xff0c;因其内部空间庞大&#xff0c;各类电器设施众多&#xff0c;如何以一种既高效又稳定&#xff0c;兼具低成本与高覆盖特性的方式&#xff0c;为那些关键线路节点开展温度监测&#xff0c;是目前在安全监测领域一项重点研究项目&#xff0c;而无锡布里渊…

开关电源设计中的穿越频率选取

摘要 在开关电源设计之中&#xff0c;穿越频率是一个相当重要的指标。在文中从就开关电源设计中的环路反馈控制方法、环路增益作用进行了阐述。并在此基础上就穿越频率选取的限制条件进行分析&#xff0c;为开关电源设计中的穿越频率选取提供借鉴。 开关电源设计过程中&#x…

探索 INFINI Console:提升 Elasticsearch 管理效率的新利器

1、常见的 Elasticsearch 可视化客户端介绍 1.1 Head 插件 这是一个非常老牌的 Elasticsearch 可视化插件&#xff08;现在改名了 Multi Elasticsearch Heads&#xff09;&#xff0c;通常以 Chrome 插件或网页形式存在&#xff0c;用来查看集群的节点状态、索引元数据&#x…

黄仁勋CES 2025演讲重点内容

黄仁勋CES 2025演讲重点内容 硬件产品发布 GeForce RTX 50系列GPU&#xff1a; 架构与性能提升&#xff1a;正式发布的新一代GeForce RTX 50系列GPU采用英伟达旗舰的Blackwell架构&#xff0c;这是自25年前引入可编程着色技术以来计算机图形领域最重大的创新。该系列显卡在图形…

【Redis】简介|优点|使用场景|为什么Redis快

目录 一、简介 二、特性&#xff08;优点&#xff09; 三、使用场景 一、简介 内存中存储数据的中间件&#xff0c;用于数据库&#xff0c;数据缓存&#xff0c;在分布式系统中能够大展拳脚 中间件&#xff1a;应用程序可以直接从 Redis 中获取数据&#xff0c;而不必频繁地…

UI自动化测试框架playwright--初级入门

一、背景&#xff1a;UI自动化的痛点&#xff1a; 1、设计脚本耗时&#xff1a; 需要思考要如何模拟用户的操作&#xff0c;如何触发页面的事件&#xff0c;还要思考如何设计脚本&#xff0c;定位和操作要交互的元素、路径、位置&#xff0c;再编写代码逻辑&#xff0c;往复循…

不同方式获取音频时长 - python 实现

DataBall 助力快速掌握数据集的信息和使用方式&#xff0c;会员享有 百种数据集&#xff0c;持续增加中。 需要更多数据资源和技术解决方案&#xff0c;知识星球&#xff1a; “DataBall - X 数据球(free)” -------------------------------------------------------------…

数学建模入门——建模流程

摘要&#xff1a;本文介绍了数学建模的一般流程概述。 目录 一、前言 二、数据预处理 三、描述性统计分析 四、模型建立 五、模型评价 一、前言 本文将为想要入门数学建模的同学讲述数学建模的一般流程。但数学建模流程并非一成不变。虽有大致步骤&#xff0c;像分析问题、…

人工智能及深度学习的一些题目(三)

1、【填空题】 使用RNNCTC模型进行语音识别&#xff0c;在产生预测输出时&#xff0c;对于输入的音频特征序列通过网络预测产生对应的字母序列&#xff0c;可以使用&#xff08; beamsearch &#xff09;算法进行最优路径搜索。 2、【填空题】 逻辑回归模型属于有监督学习中的&…

Linux-Ubuntu之SPI串行通信陀螺仪和加速度计

Linux-Ubuntu之SPI串口通信陀螺仪和加速度计 一&#xff0c;SPI通信原理二&#xff0c;ICM-20608六轴传感器控制三&#xff0c;代码1.小tip 一&#xff0c;SPI通信原理 SPI&#xff1a;串行全双工通信&#xff0c;最高能达到百MHZ&#xff0c;通常一个主设备跟多个从设备&…

【从零开始入门unity游戏开发之——unity篇04】unity6基础入门 —— 新建项目模板的选择(渲染管线相关的知识点)

文章目录 前言一、渲染管线相关知识1、什么是渲染管线&#xff08;Render Pipeline&#xff09;&#xff1f;2、渲染管线的历史背景3、什么是 Scriptable Render Pipeline&#xff08;SRP&#xff09;&#xff1f;4、Unity三种渲染管线4.1 **内置渲染管线&#xff08;Built-in …