实现uniapp-微信小程序 搜索框+上拉加载+下拉刷新
pages.json 中的配置
{
"path": "pages/message",
"style": {
"navigationBarTitleText": "消息",
"enablePullDownRefresh": true,
"onReachBottomDistance": 50
}
},
<template><view class="message"><view class="box"><u-searchshape="square":show-action="false"placeholder="请输入标题"height="80"v-model="keyword"@change="keywordChange"></u-search></view><view class="list" v-if="list.length > 0"><view class="list_item" v-for="(item, index) in list" :key="index"><view class="left"><imagev-if="item.status === 1"class="message_icon"src="/static/message.png"></image><imagev-elseclass="message_icon"src="/static/message_icon.png"></image><view class="center"><label class="title">{{ item.title }}</label><label class="time">{{ item.createdAt }}</label></view></view><label @click="handleClick(item)">查看详情</label></view></view><view class="none" v-else><label>暂无消息~</label></view></view>
</template><script>
import { noticeSelect, noticeRead } from '@/api/tabBar.js'
export default {data () {return {isSending: false,keywordId: '',keyword: '',page: {currentPage: 1,pageSize: 20,total: 0},list: [],show: false,token: this.$store.state.user.token || ''}},onShow () {this.token = this.$store.state.user.tokenif (!this.token) {//#ifdef MP-WEIXINuni.reLaunch({url: '/pages/login/index'})//#endif//#ifdef H5|| APP-PLUSuni.navigateTo({url: '/pages/login/index'})//#endifsetTimeout(() => {uni.showToast({title: '请先登录',icon: 'error',duration: 1200})}, 600)return}this.init()},onHide () {this.token = ''this.resetVal()},computed: {// listComputed () {// return this.list.filter(item => item.title.indexOf(this.keyword) > -1)// }},// 上拉触底时触发onReachBottom () {if (this.page.total === this.list.length) {return uni.showToast({title: '没有更多数据了...'})}if (this.isSending) returnthis.page.currentPage += 1this.init()},// 下拉刷新时触发onPullDownRefresh () {// 重置数据this.resetVal()// 重新请求this.init(true)},methods: {async handleClick (item) {await noticeRead(item.id)uni.setStorageSync('messageItem', JSON.stringify(item))uni.navigateTo({url: '/pages-other/MessageDetail'})},async init (bool) {this.isSending = trueconst res = await noticeSelect({...this.page,title: this.keyword})if (this.page.currentPage === 1) {this.list = res.data.returnNoticeList} else {this.list = [...this.list, ...res.data.returnNoticeList]}this.page.total = res.totalthis.isSending = falseif (bool) {uni.stopPullDownRefresh()}},keywordChange (e) {if (this.keywordId) clearTimeout(this.keywordId)this.keywordId = setTimeout(() => {this.page.currentPage = 1this.init()}, 600)},resetVal () {this.page.currentPage = 1this.page.total = 0this.list = []this.isSending = false}}
}
</script>
相关文章:
实现uniapp-微信小程序 搜索框+上拉加载+下拉刷新
pages.json 中的配置 { "path": "pages/message", "style": { "navigationBarTitleText": "消息", "enablePullDownRefresh": true, "onReachBottomDistance": 50 } }, <template><view class…...
PostgreSQL 修改字段类型但是存在视图依赖
其实视图的存在与否在数据库界一直是一个话题。用好视图可以简化程序的很多代码,用不好视图不仅会给维护带来很多的不便,也会造成很大的性能问题。下面我从维护方面给出案例,以及当存在这种问题的时候,如何去解决这个问题。 假设…...
基于.NET 9实现实时进度条功能:前后端完整示例教程
要在基于.NET 9的应用中实现进度条功能,我们可以通过HttpContext.Response来发送实时的进度更新到前端。以下是一个简单的示例,展示了如何在ASP.NET Core应用中实现这一功能。 但是,我在.net framework4.7.2框架下,实际不了HttpC…...
力扣 LeetCode 19. 删除链表的倒数第N个结点(Day2:链表)
解题思路: 快慢指针 class Solution {public ListNode removeNthFromEnd(ListNode head, int n) {ListNode dummy new ListNode(-1);dummy.next head;ListNode fast dummy;ListNode slow dummy;for (int i 0; i < n; i) {fast fast.next;}while (fast.ne…...
音频格式转换
一、场景 项目需求需要App实现声纹识别功能,调用科大讯飞接口: 声纹识别 API 文档 | 讯飞开放平台文档中心 其接口要求音频文件格式为mp3 二、问题产生 在安卓端根据官方文档说明,系统并不支持直接录制mp3格式音频,支持格式如…...
npm list @types/node 命令用于列出当前项目中 @types/node 包及其依赖关系
文章目录 作用示例常用选项示例命令注意事项 1、实战举例**解决方法**1. **锁定唯一的 types/node 版本**2. **清理依赖并重新安装**3. **设置 tsconfig.json 的 types**4. **验证 Promise 类型支持** **总结** npm list types/node 命令用于列出当前项目中 types/node 包及其…...
【Spring】Spring框架中有有哪些常见的设计模式
Spring 框架中广泛运用了多种设计模式,今天让我们来学习一下 1. 单例模式(Singleton Pattern) 用途:在Spring框架中,Bean默认是单例的,也就是说在容器中每种类型的Bean只有一个实例。这个设计可以节省资源…...
提升百度排名的有效策略与技巧解析
内容概要 提升百度排名对于网站的成功至关重要。首先,了解百度排名的基本原则,掌握搜索引擎是如何评估网页质量的,是优化过程中不可或缺的一部分。搜索引擎越来越倾向于将用户需求放在首位,因此提供高质量的内容和良好的用户体验…...
【Linux】Linux下查看cpu信息指令(top/mpstat/iostat/pidstat)说明
top命令 top(1) - Linux manual page (man7.org) top查看总的CPU利用率 us: 用户空间消耗的CPU资源占比,进程在用户态执行函数调用,编解码消耗的都是us sy: 内核空间消耗的CPU资源占比,进程调用系统调用达到内核后会增加sy的消耗 ni&…...
HDLBIts习题(3):使用冒号表示位宽时,冒号两端必须是常量
(1)易错习题1:Circuits - Combinational Logic - Multiplexers - 256-to-1 4bit multiplexer 使用冒号表示位宽时,冒号两端必须是常量,因此如果使用变量,可以使用位拼接的方法。 (2)…...
C++20协程详解
文章目录 什么是协程为什么需要协程什么时候使用协程协程的类别C20的协程协程的使用关键字co_wait框架一阶段完成数据交换co_yieldco_return 什么是协程 我们在学习编程的过程中,逐渐从单线程,到多线程,再到异步编程和并发处理 这些异步与并…...
Chromium 中chrome.system.display扩展接口定义c++
一、chrome.system.display 使用 system.display API 查询展示元数据。 权限 system.display 类型 ActiveState Chrome 117 及更高版本 用于指示系统是否检测到和使用显示屏的枚举。如果系统未检测到显示屏(可能断开连接,或因睡眠模式等原因而被视…...
容器docker的ulimit
Ulimit 在linux里ulimit命令可以对shell生成的进程的资源进行限制。 常用的ulimit限制 打开文件句柄数core文件大小设置进程能够消耗的虚拟内存设置用户能够打开的进程数目 不太常用的ulimit限制 设置数据段的最大值.单位:kbytes 设置创建文件的最大值.单位:blocks 设置在…...
一、HTML
一、基础概念 1、浏览器相关知识 这五个浏览器市场份额都非常大,且都有自己的内核。 什么是内核: 内核是浏览器的核心,用于处理浏览器所得到的各种资源。 例如,服务器发送图片、视频、音频的资源,浏览…...
使用Geekbench6软件对真实和虚拟的苹果桌面系统(macOS)进行打分比较
前言 感觉VMWare安装的MacOS使用起来非常的慢,所以特意用打分软件GeekBench进行了评测。 一、Geekbench的安装 可以从官网直接进行下载, 链接是: 二、Geekbench的直接使用 2.1、真机的信息 2.2、虚拟机的信息 三、打分的比较 3.1、真机…...
lua入门教程:随机数
在Lua中,生成随机数是通过math库中的math.random函数来实现的。这个函数可以生成一个[0, 1)区间内的随机浮点数。如果你需要生成其他范围内的随机数,或者需要整数类型的随机数,可以通过一些简单的数学运算来调整math.random的输出。 以下是如…...
华为大咖说 | 浅谈智能运维技术
本文分享自华为云社区:华为大咖说 | 浅谈智能运维技术-云社区-华为云 本文作者:李文轩 ( 华为智能运维专家 ) 全文约2695字,阅读约需8分钟 在大数据、人工智能等新兴技术的加持下,智能运维(AI…...
creo toolkit二次开发学习之获取任意选择模型作为元件,并进行获取约束等
获取任意选择模型作为元件进行操作前,先了解组件路径和程序集的构成:creo toolkit二次开发学习之程序集(ProAsmcomp)和装配体组件路径对象(ProAsmcomppath)-CSDN博客 代码如下 ProError test1() {ProError…...
sanitize-html 防止 XSS(跨站脚本攻击)
sanitize-html 是一个用于清理和验证 HTML 的 JavaScript 库,主要用于防止 XSS(跨站脚本攻击)。它允许你定义一套规则来决定哪些 HTML 标签和属性是可以被信任的,从而确保用户输入的内容不会包含潜在的恶意代码。 主要功能 HTML…...
【JavaEE】文件io
目录 文件类型 File概述 属性 构造方法 常用方法 Reader Writer InputStream OutputStream 字节流转字符流 通过Scanner读取InputStream 通过PrintWriter转换outputstream 示例 文件类型 从编程的角度看,文件类型主要就是两大类 文本(文…...
MFC内存泄露
1、泄露代码示例 void X::SetApplicationBtn() {CMFCRibbonApplicationButton* pBtn GetApplicationButton();// 获取 Ribbon Bar 指针// 创建自定义按钮CCustomRibbonAppButton* pCustomButton new CCustomRibbonAppButton();pCustomButton->SetImage(IDB_BITMAP_Jdp26)…...
测试markdown--肇兴
day1: 1、去程:7:04 --11:32高铁 高铁右转上售票大厅2楼,穿过候车厅下一楼,上大巴车 ¥10/人 **2、到达:**12点多到达寨子,买门票,美团/抖音:¥78人 3、中饭&a…...
VTK如何让部分单位不可见
最近遇到一个需求,需要让一个vtkDataSet中的部分单元不可见,查阅了一些资料大概有以下几种方式 1.通过颜色映射表来进行,是最正规的做法 vtkNew<vtkLookupTable> lut; //值为0不显示,主要是最后一个参数,透明度…...
关键领域软件测试的突围之路:如何破解安全与效率的平衡难题
在数字化浪潮席卷全球的今天,软件系统已成为国家关键领域的核心战斗力。不同于普通商业软件,这些承载着国家安全使命的软件系统面临着前所未有的质量挑战——如何在确保绝对安全的前提下,实现高效测试与快速迭代?这一命题正考验着…...
【Java学习笔记】BigInteger 和 BigDecimal 类
BigInteger 和 BigDecimal 类 二者共有的常见方法 方法功能add加subtract减multiply乘divide除 注意点:传参类型必须是类对象 一、BigInteger 1. 作用:适合保存比较大的整型数 2. 使用说明 创建BigInteger对象 传入字符串 3. 代码示例 import j…...
【C++进阶篇】智能指针
C内存管理终极指南:智能指针从入门到源码剖析 一. 智能指针1.1 auto_ptr1.2 unique_ptr1.3 shared_ptr1.4 make_shared 二. 原理三. shared_ptr循环引用问题三. 线程安全问题四. 内存泄漏4.1 什么是内存泄漏4.2 危害4.3 避免内存泄漏 五. 最后 一. 智能指针 智能指…...
CRMEB 中 PHP 短信扩展开发:涵盖一号通、阿里云、腾讯云、创蓝
目前已有一号通短信、阿里云短信、腾讯云短信扩展 扩展入口文件 文件目录 crmeb\services\sms\Sms.php 默认驱动类型为:一号通 namespace crmeb\services\sms;use crmeb\basic\BaseManager; use crmeb\services\AccessTokenServeService; use crmeb\services\sms\…...
Oracle11g安装包
Oracle 11g安装包 适用于windows系统,64位 下载路径 oracle 11g 安装包...
【C++】纯虚函数类外可以写实现吗?
1. 答案 先说答案,可以。 2.代码测试 .h头文件 #include <iostream> #include <string>// 抽象基类 class AbstractBase { public:AbstractBase() default;virtual ~AbstractBase() default; // 默认析构函数public:virtual int PureVirtualFunct…...
LCTF液晶可调谐滤波器在多光谱相机捕捉无人机目标检测中的作用
中达瑞和自2005年成立以来,一直在光谱成像领域深度钻研和发展,始终致力于研发高性能、高可靠性的光谱成像相机,为科研院校提供更优的产品和服务。在《低空背景下无人机目标的光谱特征研究及目标检测应用》这篇论文中提到中达瑞和 LCTF 作为多…...
