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

【微信小程序】4plus|搜索框-历史搜索 | 我的咖啡店-综合实训

news 来源：原创 2025/5/16 5:10:38

升级版1-清空全部的再次确认

实现功能：

历史搜索记录
展示-历史搜索记录展示10条
点击跳转-点击历史搜索记录可同步到搜索框并自动搜索
全部删除-可一次性全部删除历史搜索记录
全部删除-有再次确认操作

展示

进行搜索后留下搜索记录

点击垃圾桶图标，显示【清空全部】

点击【清空全部】后，历史记录被清空

1. 页面初始数据设置

在 search.js 中，我们定义了页面的初始数据，包括搜索历史列表 historyList、搜索关键词 keyword 以及控制清空按钮显示的 showClearAllButton。

// pages/search/search.js
Page({data: {historyList: [],keyword: "",showClearAllButton: false},// ...其他函数...
});

2. 显示清空全部按钮

个函数通过修改 showClearAllButton 的值来控制“清空全部”按钮的显示和隐藏。

  // 显示清空全部按钮showClearAll() {this.setData({showClearAllButton: true});},

this.setData 是微信小程序中用于更新页面数据的方法。当 setData 被调用时，它不仅会更新页面的数据，还会触发页面的重新渲染，以反映新的数据状态。
showClearAllButton 是页面数据（data）中的一个属性，用于控制“清空全部”按钮的显示。当其值为 true 时，按钮显示；为 false 时，按钮隐藏。

3. 清空搜索历史

在 clearAllHistory 函数中，我们使用 wx.showModal 来显示一个确认对话框，确保用户真的想要清空搜索历史。

// pages/search/search.js
clearAllHistory() {wx.showModal({title: '清空历史',content: '确定要清空所有搜索历史吗？',success: (res) => {if (res.confirm) {this.setData({historyList: [],showClearAllButton: false});wx.removeStorageSync('searchKeyArr');}}});
},

4. WXML 结构

在 search.wxml 中，我们使用条件渲染来控制清空按钮的显示和隐藏。

<!--pages/search/search.wxml-->
<view class="search"><!-- 搜索框开始 --><van-search ...><view slot="action" bind:tap="onSearch" style="padding:0 30rpx">搜索</view></van-search><!-- 搜索框结束 --><!-- 搜索历史视图开始 --><view class="history" wx:if="{{historyList.length}}"><!-- 标题 --><view class="title"><view class="text">搜索历史</view><view class="remove" wx:if="{{!showClearAllButton}}" bindtap="showClearAll"><van-icon name="delete-o" size="21" /></view><view class="clear-all" wx:if="{{showClearAllButton}}" bindtap="clearAllHistory">清空全部</view></view><!-- 内容区域 --><view class="content"><!-- 循环显示搜索历

【微信小程序】4plus|搜索框-历史搜索 | 我的咖啡店-综合实训

升级版1-清空全部的再次确认实现功能：历史搜索记录展示-历史搜索记录展示10条点击跳转-点击历史搜索记录可同步到搜索框并自动搜索全部删除-可一次性全部删除历史搜索记录全部删除-有再次确认操作展示进行搜索后留下搜索记录点击垃圾桶图标，显示【清空全部】点击【清…...

编程日记 2025/5/16 5:10:38

学习笔记（C#基础书籍）-- C#高级应用

（12.25，12.26） I/O数据流技术：《第十二章》为了能够长时间保存程序中的数据，I/O技术可以将数据保存到文件（如文本文件等）中。 ⭕文件基本操作 a.File类：支持对文件的基本操作&…...

编程日记 2025/5/11 17:52:08

pytorch将数据与模型都放到GPU上训练

默认是CPU，如果想要用GPU需要： 安装配置cuda，然后更新/下载支持gpu版本的pytorch，可以参考：https://blog.csdn.net/weixin_35757704/article/details/124315569设置device：device torch.device(cuda if t…...

编程日记 2025/5/7 17:21:31

华为 IPD，究竟有什么特点？（二）

关注作者 （四）华为版 IPD 特点四：一定要把差异化竞争力持续建立在平台上平台不仅带来研发效率的提升，更重要的是，它是技术竞争力的载体，是研发质量的重要保证。 1）为什么很多企业摆脱不了同…...

编程日记 2025/5/12 1:12:18

CV(7)--神经网络训练

前言仅记录学习过程，有问题欢迎讨论什么是神经网络： 神经网络是一种模拟人脑神经元工作原理的算法，它由多个神经元组成，每个神经元都接受输入，通过计算产生输出，并将输出传递给其他神经元。神经网络的…...

编程日记 2025/5/16 4:52:11

git更改当前项目的远程仓库，保留原始仓库提交记录提交到新仓库

在开发过程中，有时需要将当前项目的远程仓库切换到另一个新的远程仓库，同时保留所有原始的提交记录。以下是详细的步骤和最佳实践，确保你能够顺利完成这一操作。更改当前项目的远程仓库 1.查看当前的远程仓库确认当前项目的远程仓库地址。…...

编程日记 2025/5/12 2:00:31

【产品应用】一体化无刷电机在旋转等离子喷枪中的应用

在现代工业制造与加工领域，等离子喷枪凭借其高温、高速的等离子射流，能够实现高效的材料表面处理、切割以及焊接等工艺，在众多行业中发挥着关键作用。而一体化无刷电机的应用，更是为等离子喷枪的性能提升和稳定运行注入了强大动力…...

编程日记 2025/5/10 15:41:43

这个配置中是能够正常进行网页访问的，能够查看网页 [uwsgi] chdir /home/luichun/lc/Pyfile/PyCursor/app module app.wsgi:application plugin-dir /usr/lib/uwsgi/plugins plugins python311 env TZAsia/Shanghai socket-timeout 60 websocket-ma…...

编程日记 2025/5/15 17:39:56

【自由能系列（初级），论文解读】神经网络中，熵代表系统的不确定性，自由能则引导系统向更低能量的状态演化，而动力学则描述了系统状态随时间的变化。

神经网络中的熵、自由能与动力学核心结论： 神经网络在“学习”和“成长”过程中，熵、自由能以及动力学扮演着关键角色。熵代表系统的不确定性，自由能则引导系统向更低能量的状态演化，而动力学则描述了系统状态随时间的变化。这…...

编程日记 2025/5/12 8:17:22

云计算时代携程的网络架构变迁

大家觉得有意义和帮助记得及时关注和点赞!!! 前言0 携程云平台简介网络演进时间线1 基于 VLAN 的二层网络 1.1 需求1.2 解决方案：OpenStack Provider Network 模型1.3 硬件网络拓扑1.4 宿主机内部网络拓扑1.5 小结优点缺点2 基于 SDN 的大二层网络 2.1 面临的新问…...

编程日记 2025/5/6 6:47:14

uniapp 微信小程序数据空白展示组件

效果图 html <template><view class"nodata"><view class""><image class"nodataimg":src"$publicfun.locaAndHttp()?localUrl:$publicfun.httpUrlImg(httUrl)"mode"aspectFit"></image>&l…...

编程日记 2025/5/14 12:25:57

java 线程池为什么设计成先进队列再创建最大线程为何先入队列再增加线程数？

java 线程池为什么设计成先进队列再创建最大线程为何先入队列再增加线程数？ 这个设计与线程池的性能优化、资源利用和任务调度策略密切相关。要理解为什么线程池设计成“ 先将任务入队列，再创建最大线程数 ”，可以从以下几个方面进行分析&…...

编程日记 2025/5/14 15:38:16

我的Qt作品（20）使用Qt+OpenCV写一个旋转/抠图/mask生成工具

使用QtOpenCV写一个旋转/抠图/mask生成工具 1、旋转功能 void FormRotate::rotateImage(const cv::Mat &src, cv::Mat &dst, double degree) //旋转 {if (fabs(degree) < 0.001){dst src;return;}//center旋转的中心点坐标//degree旋转的角度,不是弧度,>0逆时针…...

编程日记 2025/5/12 1:27:54

【vue】vite + ts +vue3 安装及使用 pinia

vue3 TS 安装使用pinia状态管理_vue3 ts pinia-CSDN博客 Vue项目进阶：再谈Pinia函数式（composition API）用法-腾讯云开发者社区-腾讯云...

编程日记 2025/4/17 11:39:01

计算机网络（10）网络层

前言计算机网络中的网络层（Network Layer）是OSI（开放系统互连）模型中的第三层，也是TCP/IP模型中的第二层，它位于数据链路层和传输层之间。网络层的主要任务是负责数据包从源主机到目的主机的路径选择和数据…...

编程日记 2025/5/9 21:51:29

1085 PAT单位排行

每次 PAT 考试结束后，考试中心都会发布一个考生单位排行榜。本题就请你实现这个功能。输入格式： 输入第一行给出一个正整数 N（≤105），即考生人数。随后 N 行，每行按下列格式给出一个考生的信息&#xff…...

编程日记 2025/5/6 20:28:36

知识库1: 什么是知识库？

知识库（Knowledge Base, KB）是一个存储和组织知识的信息系统或数据集合，用于保存、管理和访问结构化或非结构化的信息。它的目的是帮助人们快速获取所需的知识、解答问题或支持决策。知识库可以被广泛应用于技术支持、教育、研究以及智能系统…...

编程日记 2025/5/14 11:18:01

[SAP ABAP] 程序备份

备份当前程序到本地的方式如下： 1.复制粘贴 Ctrl A 、Ctrl V 2.【实用程序】|【更多实用程序】|【上载/下载】|【下载】 3.快捷键，支持多种格式导出(.abap .html .pdf 等) 在事务码SE38(ABAP编辑器)屏幕右下角，点击【Options选项】图…...

编程日记 2025/5/14 20:08:34

SpringBoot 自动装配原理及源码解析

目录一、引言二、什么是 Spring Boot 的自动装配三、自动装配的核心注解解析 3.1 SpringBootApplication 注解 （1）SpringBootConfiguration： （2）EnableAutoConfiguration： （3&#xf…...

编程日记 2025/5/11 11:13:42

【专题】2024年悦己生活消费洞察报告汇总PDF洞察（附原数据表）

原文链接： https://tecdat.cn/?p38654 在当今时代背景下，社会发展日新月异，人们的生活方式与消费观念正经历深刻变革。MoonFox 月狐数据的《2024 年悦己生活消费洞察报告》聚焦于这一充满活力与变化的消费领域。随着就业、婚姻等社会压力的…...

编程日记 2025/5/15 7:45:41

empire靶机

打开靶机我们先查看页面源代码，发现什么也没有再去用nmap扫描 nmap -sV -p- 192.168.95.144 发现也没什么用我们在用dirb扫一下 dirb http://192.168.95.144 我们发现了robots.txt并且响应码是200，去访问一下又得到了一个目录，去访问…...

编程日记 2025/5/11 9:44:21

uniapp 判断多选、选中取消选中的逻辑处理

一、效果展示二、代码 1.父组件： :id=“this.id” ：给子组件传递参数【id】 @callParentMethod=“takeIndexFun” ：给子组件传递方法，这样可以在子组件直接调用父组件的方法 <view @click="$refs.member.open()"...

编程日记 2025/4/22 3:12:10

arthas查看拼接好参数的sql, redis, es完整可直接执行的命令

arthas查看拼接好参数的sql, redis, es完整可直接执行的命令 arthas查看sql可执行命令arthas查看redis可执行命令arthas查看es可执行命令相关链接经常修bug的时候, 拿不到能够执行的命令, 真是太难受了 arthas查看sql可执行命令 # mybatis plus (参数和sql分离了) watch org.…...

编程日记 2025/5/13 4:40:15

Flamingo：少样本多模态大模型

Flamingo：少样本多模态大模型论文大纲理解1. 确认目标2. 分析过程（目标-手段分析）3. 实现步骤4. 效果展示5. 金手指解法拆解全流程核心模式提问Flamingo为什么选择使用"固定数量的64个视觉tokens"这个特定数字?这个数字的选择背…...

编程日记 2025/4/24 20:19:16

nacos-gateway动态路由

在Nacos官网中给出了手动监听Nacos配置变更的SDK： Nacos Java SDK 所需依赖  <dependency><groupId>com.alibaba.cloud</groupId><artifactId>spring-cloud-starter-alibaba-nacos-config</artifactId> <…...

编程日记 2025/5/15 22:02:37

Kotlin 协程基础知识总结二 —— 启动与取消

协程启动与取消的主要内容： 启动协程：启动构建器、启动模式、作用域构建器、Job 生命周期取消协程：协程的取消、CPU 密集型任务取消、协程取消的副作用、超时任务 1、协程构建器 （P20）launch 与 aysnc 两种协程构建…...

编程日记 2025/5/16 5:02:22

【漏洞复现】Struts2（CVE-2024-53677）任意文件上传逻辑绕过漏洞

文章目录前言一、漏洞描述二、漏洞详情三、影响版本四、危害描述五、漏洞分析六、漏洞复现七、修复建议前言 Struts2框架是一个用于开发Java EE网络应用程序的开放源代码网页应用程序架构。它利用并延伸了Java Servlet API，鼓励开发者采用MVC架构。Struts2以WebWork优秀的设…...

编程日记 2025/5/16 4:52:11

使用 IDE生成 Java Doc

使用步骤 Android Studio界面->Tools->Generate JavaDoc zh-CN -encoding UTF-8 -charset UTF-8 -classpath “C:\Users\fangjian\AppData\Local\Android\Sdk\platforms\android-34\android.jar” 报错问题错误: 目标 17 不允许选项 --boot-class-path 如果你正在使用…...

编程日记 2025/5/16 4:53:16

AWS、Google Cloud Platform (GCP)、Microsoft Azure、Linode和桔子数据的价格对比

要对比 AWS、Google Cloud Platform (GCP)、Microsoft Azure、Linode 和桔子数据的价格，我们需要先了解每个平台的定价模型、服务类型以及不同服务之间的价格差异。以下是根据各个平台常见服务（如计算实例、存储、数据传输等）做的一个简化…...

编程日记 2025/5/9 5:46:13

【C++篇】AVL树的实现

前言本篇是基于二叉搜索树写的，详情可以去看上篇【二叉搜索树】一，AVL树的概念 （1），AVL树是一颗二叉搜索树，它是一棵空树或者是具备以下性质的二叉搜索树：它的左右子树都是AVL树&#xff…...

编程日记 2025/5/10 7:31:45

VIVO Android面试题及参考答案

请重写算法题：求数组的全排列。思路：要获取一个数组的全排列，我们可以利用回溯算法。具体来说，回溯算法通过递归的方式逐步生成排列，在每一步都将一个元素加入排列中，然后在下一步递归中排除已选元素，回溯的时候撤销选择，尝试其他可能。步骤：递归生成排列：使…...

编程日记 2025/5/5 16:46:33

联邦大模型微调

微调（Fine-tuning）是一种迁移学习的技术，用于在一个已经预训练好的模型基础上，通过进一步训练来适应特定的任务或数据集。微调可以在具有相似特征的任务之间共享知识，从而加快训练速度并提高模型性能。微调步骤&…...

编程日记 2025/5/11 4:36:53

DigitalOcean Kubernetes现已支持VPC natvie集群

DigitalOcean Kubernetes (DOKS)的VPC natvie集群功能现已正式上线！这一新功能实现了DOKS集群与虚拟私有云（VPC）资源之间的无缝集成，提升了工作负载的网络灵活性和可扩展性。什么是VPC natvie 集群？ VPC natvie 集群支…...

编程日记 2025/5/12 3:22:26

【每日学点鸿蒙知识】H5与C++通讯、动态参数化配置、ArkTS调用JS、Json对象转换、showToast在多次调用问题

1、HarmonyOS h5页面和C如何进行双向通讯？ 前的规格是H5只能和ArkTS通讯，ArkTS通过NDK接口与C通讯，只有网络拦截有C接口。参考链接：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/_web-V5 2、HarmonyO…...

编程日记 2025/5/7 23:17:32

ZC706开发板教程：使用SD卡启动工具烧写flash

在使用开发板的过程中，常常需要通过 Flash 模式启动。然而，使用 JTAG 模式在线烧写 flash 的过程既繁琐又耗时，许多用户对此表示困扰。本期将为您提供解决方案，以简化这一流程。我们分析正常的flash烧写过程，就是通过…...

编程日记 2025/5/10 12:16:12

问题-01

Mybatis比较失效问题 1、问题复现 whetherPromoterNull是字符串类型，0使用单引号包裹，进行比较时发现不起作用 <if test"whetherPromoterNull ! null and whetherPromoterNull.trim() 0"> and sui.share_user_id is not null</if&g…...

编程日记 2025/5/2 18:29:13

内容营销专家刘鑫炜：误区四，目标不明，营销如同“盲头苍蝇”？

我们经常会遇到这样的客户，稿件提交过来后，一会儿说要发这个媒体，不一会儿又要发那个媒体，而且这两个媒体根本没有关联性，这时候，我们都会问客户，你推广这篇稿件的目的是什么，是为了…...

编程日记 2025/5/14 7:49:42

java基础1：处理Map

一、适用场景：相对Map排序，想获取其中最大或最小值。 1、获取map集合里，获取 max(value)对应的key 1)、方式1 Testpublic void MapInnerMaxValue() {HashMap<String, Integer> hashMap new HashMap<>();hashMap.put("a&q…...

编程日记 2025/5/15 15:27:25

企业销售人员培训系统｜Java｜SSM｜VUE｜前后端分离

【技术栈】 1⃣️：架构: B/S、MVC 2⃣️：系统环境：Windowsh/Mac 3⃣️：开发环境：IDEA、JDK1.8、Maven、Mysql5.7 4⃣️：技术栈：Java、Mysql、SSM、Mybatis-Plus、VUE、jquery,html 5⃣️数据库可…...

编程日记 2025/5/15 0:44:25

设计模式-责任链模式

一、简介责任链模式（Chain of Responsibility Pattern）是一种行为型设计模式，用于将请求的发送者与接收者解耦，使多个处理对象都有机会处理该请求。这些处理对象通过形成一条链式结构依次处理请求，直到某个对象能够完…...

编程日记 2025/5/14 17:40:33

04、Spring MVC

Spring MVC是Spring的Web模块，用来开发Web应用的，它最终作为B/S、C/S模式下的Server端 Web应用的核心就是处理HTTP请求并响应。一、关于两种开发模式说明我们使用Spring MVC有两个开发模式前后分离（数据与页面分离） @ResponseBody@RestController其涉及的生要机制是：…...

编程日记 2025/5/13 17:19:45

K8S 黑魔法之如何从 Pod 拿到节点的命令行

搞 K8S 运维的时候，偶尔会遇到一个难题，定位到问题出在某个节点上，而由于权限审批，错误配置等等各种原因，没有办法拿到节点的 SSH 权限，无法进入节点命令行进一步排障。这个时候，就可以用这个…...

编程日记 2025/5/4 6:34:11

谷歌用Anthropic的Claude帮Gemini“打磨”性能

每周跟踪AI热点新闻动向和震撼发展想要探索生成式人工智能的前沿进展吗？订阅我们的简报，深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同，从行业内部的深度分析和实用指南中受益。不要错过这个机会，成为AI领…...

编程日记 2025/5/12 12:27:11

React性能优化：构建更高效的应用

在现代前端开发中，React已经成为构建复杂、交互频繁应用的首选框架。然而，随着应用规模的扩大和功能的丰富，组件的频繁重渲染可能会成为性能瓶颈，影响用户体验。为了提升React应用的性能，开发者需要掌握一系列性能优化技巧和工具。本文将详细介绍React性能优化的各个方面，…...

编程日记 2025/5/15 21:50:29

Linux从0到1——线程同步和互斥【互斥量/条件变量/信号量/PC模型】

Linux从0到1——线程同步和互斥 1. Linux线程互斥1.1 问题引入1.2 互斥相关概念1.3 多执行流并发访问公共资源的数据不一致问题1.4 互斥量（锁）1.5 改进抢票系统1.6 锁的简单封装1.7 锁的实现原理1.8 可重入VS线程安全1.9 死锁 2. Linux线程同步2.1 理解同…...

编程日记 2025/5/15 12:06:37