分页以及tab栏切换,动态传类型

<view class="disTitle"><view class="disName">账户明细</view><view class="nav"><u-tabs lineWidth="0" :activeStyle="{color: '#FD893F' }" :list="navList" @change="tabsChange":scrollable="false" :current="tabsCurrent"></u-tabs></view></view><view v-if="tabsCurrent === 0"><view class="content"><view class="conItem" v-for="item in list" :key="item.id"><view class="left"><view class="">{{item.sourceName}}</view><view class="">{{dataFormat(item.sourceTime)}}</view></view><view class="right" v-if="item.type===1" style="color: #F75038;">+{{item.money}}</view><view class="right" v-else-if="item.type===2">-{{item.money}}</view></view></view></view><view v-if="tabsCurrent === 1"><view class="content"><view class="conItem" v-for="item in list" :key="item.id"><view class="left"><view class="">{{item.sourceName}}</view><view class="">{{dataFormat(item.sourceTime)}}</view></view><view class="right" v-if="item.type===1" style="color: #F75038;">+{{item.money}}</view><view class="right" v-else-if="item.type===2">-{{item.money}}</view></view></view></view><view v-if="tabsCurrent === 2"><view class="content"><view class="conItem" v-for="item in list" :key="item.id"><view class="left"><view class="">{{item.sourceName}}</view><view class="">{{dataFormat(item.sourceTime)}}</view></view><view class="right" v-if="item.type===1" style="color: #F75038;">+{{item.money}}</view><view class="right" v-else-if="item.type===2">-{{item.money}}</view></view></view></view><view v-if="list.length<=0"><u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png"></u-empty></view>
tabsCurrent: 0,navList: [{name: '全部',}, {name: '收入',}, {name: '支出'}],list: [],type: '',page: 1,pageSize: 10,onReachBottom() {if (this.list.length < this.total) {this.getBonusRollover(); // 加载下一页 }},methods:{//点击tab栏掉接口tabsChange(e) {this.tabsCurrent = e.index;this.page = 1 //充值为第一页this.list = []//清空列表if (this.tabsCurrent === 0) {this.type = ''//类型this.getBonusRollover()} else if (this.tabsCurrent === 1) {this.type = 1//类型this.getBonusRollover()} else if (this.tabsCurrent === 2) {this.type = 2//类型this.getBonusRollover()}},getBonusRollover() {let that = thislet params = {statementType: 1, // 1 余额 2 优惠金source: '',type: that.type, //全部'' 收入1 支出2 动态复制type类型,在切换的时候,默认传空pageNo: that.page,pageSize: that.pageSize}bonusRollover(params).then(res => {that.total = res.data.data.totalthat.page = that.page + 1;that.list =that.list.concat(res.data.data.list) })},}
相关文章:
分页以及tab栏切换,动态传类型
<view class"disTitle"><view class"disName">账户明细</view><view class"nav"><u-tabs lineWidth"0" :activeStyle"{color: #FD893F }" :list"navList" change"tabsChange&quo…...
【算法】平衡二叉树
难度:简单 题目 给定一个二叉树,判断它是否是 平衡二叉树 示例: 示例1: 输入:root [3,9,20,null,null,15,7] 输出:true 示例2: 输入:root [1,2,2,3,3,null,null,4,4] 输出&…...
五、 计算机网络(考点篇)
1 网络概述和模型 计算机网络是计算机技术与通信技术相结合的产物,它实现了远程通信、远程信息处理和资源共享。计算机网络的功能:数据通信、资源共享、管理集中化、实现分布式处理、负载均衡。 网络性能指标:速率、带宽(频带宽度或传送线路…...
如何解决数据分析问题:IPython与Pandas结合
如何解决数据分析问题:IPython与Pandas结合 数据分析是现代科学研究、商业决策和技术开发中的一个重要环节。IPython和Pandas是两个强大的工具,它们可以大大简化和加速数据分析的过程。本文将为初学者详细介绍如何结合使用IPython和Pandas来解决数据分析…...
如何在 Microsoft Edge 上使用开发人员工具
Microsoft Edge 提供了一套强大的开发人员工具,可帮助 Web 开发人员检查、调试和优化他们的网站或 Web 应用程序。 无论您是经验丰富的 Web 开发人员还是刚刚起步,了解如何有效地使用这些工具都可以对开发过程产生重大影响。 在本文中,我们…...
《Linux系统编程篇》认识在linux上的文件 ——基础篇
前言 Linux系统编程的文件操作如同掌握了一把魔法钥匙,打开了无尽可能性的大门。在这个世界中,你需要了解文件描述符、文件权限、文件路径等基础知识,就像探险家需要了解地图和指南针一样。而了解这些基础知识,就像学会了魔法咒语…...
Qt:22.鼠标相关事件(实例演示——鼠标进入/离开某控件的事件、鼠标按下事件、鼠标释放事件、鼠标双击事件)
目录 1.实例演示——鼠标进入/离开某控件的事件: 2.鼠标按下事件: 3.鼠标释放事件: 4.鼠标双击事件: 1.实例演示——鼠标进入/离开某控件的事件: 首先创建一个C类文件 Label,填写好要继承的父类 QLabe…...
笔记 4 :linux 0.11 中继续分析 0 号进程创建一号进程的 fork () 函数
(27)本条目开始, 开始分析 copy_process () 函数,其又会调用别的函数,故先分析别的函数。 get_free_page () ; 先 介绍汇编指令 scasb : 以及 指令 sstosd :…...
Vue3 引入Vanta.js使用
能搜到这篇文章 想必一定看过demo效果图了吧 示例 Vanta.js - Animated 3D Backgrounds For Your Website (vantajs.com) 1. 引入 在根目录 index.html中引入依赖 <script src"https://cdnjs.cloudflare.com/ajax/libs/three.js/r134/three.min.js"></sc…...
LeetCode --- 134双周赛
题目 3206. 交替组 I 3207. 与敌人战斗后的最大分数 3208. 交替组 II 3209. 子数组按位与值为 K 的数目 一、交替组 I & II 题目中问环形数组中交替组的长度为3的子数组个数,主要的问题在于它是环形的,我们要考虑首尾相接的情况,如何…...
快速读出linux 内核中全局变量
查问题时发现全局变量能读出来会提高效率,于是考虑从怎么读出内核态的全局变量,脚本如下 f open("/proc/kcore", rb) f.seek(4) # skip magic assert f.read(1) b\x02 # 64 位def read_number(bytes):return int.from_bytes(bytes, little,…...
postman录制设置
一、前言: postman是一个很好接口调试或是测试工具,简单方便,不需要很复杂的流程与技术,并且也具备录制条件。对于接口不了解,没有明确对应的说明,但又想通过接口进行一些测试使用其录制是一个不错的办…...
redis消息队列
redis 的list类型实现消息队列: list结构实现的优缺点: 2、pubsub模式(消息发布订阅)实现消息队列 pubsub的优缺点: 命令行实现: pub:第一次发送有两个接收,第二个只有一个接收 sub接收&#x…...
Linux vim的使用(一键安装则好用的插件_forcpp),gcc的常见编译链接操作
vim 在Linux系统上vim是个功能还比较完善的软件。但是没装插件的vim用着还是挺难受的,所以我们直接上一款插件。 我们只需要在Linux上执行这个命令就能安装(bite提供的) curl -sLf https://gitee.com/HGtz2222/VimForCpp/raw/master/install.sh -o ./install.sh …...
css基础(1)
CSS CCS Syntax CSS 规则由选择器和声明块组成。 CSS选择器 CSS选择器用于查找想要设置样式的HTML元素 一般选择器分为五类 Simple selectors (select elements based on name, id, class) 简单选择器(根据名称、id、类选择元素) //页面上的所有 …...
高并发线程池设计Nginx线程池源码剖析
为什么我们需要线程池?Why? 省流: 为了解决: 1.访问磁盘速度慢 2.等待设备工作 3..... 我们使用多线程技术,在IO繁忙的时候优先处理别的任务 为了解决多线程的缺陷: 1.创建、销毁线程时间消耗大 2.创建线程太多使系统资源不足或者线程频繁切换…...
SEO:6个避免被搜索引擎惩罚的策略-华媒舍
在当今数字时代,搜索引擎成为了绝大多数人获取信息和产品的首选工具。为了在搜索结果中获得良好的排名,许多网站采用了各种优化策略。有些策略可能会适得其反,引发搜索引擎的惩罚。以下是彭博社发稿推广的6个避免被搜索引擎惩罚的策略。 1. 内…...
STM32之六:SysTick系统滴答定时器
目录 1. SysTick简介 2. 时钟来源 3. SysTick寄存器 3.1 CTRL—SysTick控制及状态寄存器 3.2 RELOAD—SysTick重装载数值寄存器 3.3 CURRENT—SysTick当前数值寄存器 4. systick系统定时器配置 5. 延时函数实现 5.1 延时函数编写步骤 5.2 微秒级延时函数delay_us 5.…...
全栈物联网项目:结合 C/C++、Python、Node.js 和 React 开发智能温控系统(附代码示例)
1. 项目概述 本文详细介绍了一个基于STM32微控制器和AWS IoT云平台的智能温控器项目。该项目旨在实现远程温度监控和控制,具有以下主要特点: 使用STM32F103微控制器作为主控芯片,负责数据采集、处理和控制逻辑采用DHT22数字温湿度传感器,精确采集环境温湿度数据通过ESP8266 W…...
WPF学习(3) -- 控件模板
一、操作过程 二、代码 <Window x:Class"学习.MainWindow"xmlns"http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x"http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d"http://schemas.microsoft.com/expressio…...
开源合规生死线,DeepSeek协议识别错误率高达63%?2024企业级扫描避坑清单全公开
更多请点击: https://intelliparadigm.com 第一章:开源合规生死线,DeepSeek协议识别错误率高达63%?2024企业级扫描避坑清单全公开 近期第三方审计机构对主流AI增强型开源扫描工具开展交叉验证测试,结果显示DeepSeek-R…...
如何5分钟搭建暗黑破坏神2存档编辑器:终极可视化解决方案指南
如何5分钟搭建暗黑破坏神2存档编辑器:终极可视化解决方案指南 【免费下载链接】d2s-editor 项目地址: https://gitcode.com/gh_mirrors/d2/d2s-editor 还在为暗黑破坏神2复杂的存档编辑而烦恼吗?想要自由调整角色属性却无从下手?d2s-…...
VMnet8 的8到底是什么意思?
它的本质是:8 仅仅是一个 内部标识符 (Internal Identifier) 或 数组索引 (Array Index),用于在 VMware 的虚拟化网络栈中唯一标识 NAT 模式 对应的虚拟交换机实例。它没有任何数学、物理或协议层面的特殊含义(如端口号、版本号或二进制位&am…...
yEd画流程图保姆级避坑指南:从界面解析到高效导出PNG/JPG全流程
yEd流程图高效绘制全攻略:从界面优化到专业导出的进阶技巧第一次打开yEd时,那个布满各种面板和参数的界面确实容易让人望而生畏。但别担心,经过几个月的深度使用,我发现这款工具其实隐藏着许多能极大提升效率的设计细节。本文将带…...
Java入门全记录
一、表达式 1. 概念 由变量、运算符、字面值组成的式子,运算后会产生一个结果。 两变量参与运算,结果类型规则 如果参与运算的变量有一个为 double 类型,结果就是 double 类型 如果没有 double ,有一个为 float 类型,结…...
告别ENVI/Erdas!用PCI Geomatica处理Pleiades立体像对,手把手教你提取高精度DEM(附数据与避坑指南)
从Pleiades立体像对到高精度DEM:PCI Geomatica全流程实战解析 在遥感数据处理领域,数字高程模型(DEM)的生成一直是核心工作之一。传统主流软件如ENVI和Erdas虽然功能全面,但在处理高分辨率卫星立体像对时,特…...
如何精准识别高校院所与企业之间的潜在合作机会?
核心要点 传统“相亲角”式校企对接效率低下,根源在于科研供给与市场需求间的信息断层,必须转向以数据驱动、模型研判为核心的精准识别机制,才能将模糊的产学研线索转化为可落地的合作机会。精准识别合作机会的关键在于分拆为“供给侧”与“需…...
德国、奥地利和瑞士 SaaS 市场销售策略大揭秘:风险优先,节奏放慢!
1. 嵌入工作流介绍嵌入工作流有其官网主页,具备多种功能,如 ChatGPT 集成、专家支持、无需编码、白标、集成等;还有多种解决方案,包括代理商、CRM、iPaaS 替代方案、物业管理、房地产、初创企业、WordPress 插件、增加收入等&…...
机器学习生存分析实战:从XGBoost-AFT到临床预测模型构建
1. 项目概述:当机器学习遇上生存分析在肿瘤临床研究和患者管理中,一个核心且充满挑战的问题是:如何准确预测患者的生存时间?传统方法,比如经典的Cox比例风险模型,为我们提供了坚实的统计学基础,…...
WordPress AI: 7.0如何为AI驱动的网站奠定基础
此前,所有集成人工智能的 WordPress 插件都必须自行构建基础架构。 即将推出的 WordPress 7.0 版本改变了这一现状,它引入了共享的基础架构,支持 AI 在各个站点上的运行。 AI 工具现在可以发现网站的功能,通过统一的层访问 Word…...
