uniapp 微信小程序 均分数据展示
效果图
数据展示,可自行搭配

html
<view class="num-wrapper"><view class="num-item" @click.stop="routerGo('跳转的地址')"><text class="num">¥{{ 要展示的数据 || 0}}</text><view class="txt">余额</view></view><view class="num-item num-item-center" @click="routerGo('跳转的地址')"><text class="num">{{ 要展示的数据 || 0}}</text><view class="txt">免费次数</view></view><view class="num-item" @click.stop="routerGo('跳转的地址')"><text class="num">{{ 要展示的数据 || 0}}</text><view class="txt">优惠券</view></view></view>
css
.num-wrapper {width: 690rpx;margin: auto;padding: 30rpx 20rpx;border-radius: 8rpx;background: #FFFFFF;box-shadow: 0rpx 2rpx 4rpx 0rpx rgba(0, 0, 0, 0.05);display: flex;align-items: center;justify-content: space-between;margin-top: 22rpx;// padding: 0 47rpx;color: #036045;margin-top: 30rpx;font-family: 'MyFont';.num-item {width: 33.33%;text-align: center;&~.num-item {position: relative;&:before {content: '';position: absolute;width: 1rpx;height: 28rpx;top: 50%;margin-top: -14rpx;// background-color: rgba(255, 255, 255, 0.4);left: 0;}}.num {font-size: 42rpx;font-weight: bold;}.txt {margin-top: 8rpx;font-size: 26rpx;color: #6B7280;font-family: 'Roboto';}}.num-item-center {border-left: 1rpx solid #F3F4F6;border-right: 1rpx solid #F3F4F6;}}
需求可自行修改
相关文章:
uniapp 微信小程序 均分数据展示
效果图 数据展示,可自行搭配 html <view class"num-wrapper"><view class"num-item" click.stop"routerGo(跳转的地址)"><text class"num">¥{{ 要展示的数据 || 0}}</text><view…...
Nacos 3.0 考虑升级到 Spring Boot 3 + JDK 17 了!
Nacos 由阿里开源,是 Spring Cloud Alibaba 中的一个重要组件,主要用于发现、配置和管理微服务。 由于 Spring Boot 2 的维护已于近期停止,Nacos 团队考虑升级到 Spring Boot 3 JDK 17,目前正在征求意见和建议。 这其实是一件好…...
跟沐神学读论文-论文阅读管理
摘要 近期有读论文的需求,就需要去了解一下论文到底要怎么读,同一个系列之间的论文如何作整理和归纳,之前也有了解过市面上有成熟的论文阅读工具,但是对于学生党来讲没什么性价比,在B站上看到沐神有讲解他的思路Typor…...
Python 参数配置使用 XML 文件的教程 || Python打包 || 模型部署
当配置项存储在外部文件(如 XML、JSON)时,修改配置无需重新编译和发布代码。通过更新 XML 文件即可调整参数,无需更改源代码,从而提升开发效率和代码可维护性。 1. 为什么选择 XML 配置文件 XML 配置文件具有多种优点…...
[SV]如何在UVM环境中使用C Model
在UVM环境中使用C Memory 一、C语言实现Memory 1.1 代码说明 Memory 初始化: memory_init() 函数将内存空间初始化为 0,并初始化互斥锁。AXI 写操作 (axi_write): 检查地址范围是否合法。使用 memcpy 将数据从输入缓冲区写入模拟内存。使用互斥锁保证线程安全。AXI 读操作 …...
十大开源的Cursor AI替代方案
随着AI的兴起,所使用的工具也在不断进步。Cursor AI 作为一个强大的编码助手,已经成为开发人员不可或缺的工具。开源替代方案提供了透明性、个性化和成本效益。本文深入探讨了Cursor AI 的十大开源替代方案,这些方案将丰富您的编码体验&#…...
相机光学(四十六)——镜头马达(VCM)控制策略模式
One Step Mode、Linear Slope Control(LSC)和Acceleration Control是三种不同的控制模式,它们在控制策略和应用场景上有所区别。这些控制模式在VCM中的应用是为了提高其性能,减少振动,加快响应速度,并提高定…...
专业140+总分410+浙江大学842信号系统与数字电路考研经验浙大电子信息与通信工程,真题,大纲,参考书。
考研落幕,本人本中游211,如愿以偿考入浙江大学,专业课842信号系统与数字电路140,总分410,和考前多次模考预期差距不大(建议大家平时做好定期模考测试,直接从实战分数中,找到复习的脉…...
了解ARM的千兆以太网——RK3588
1. 简介 本文并不重点讲解调试内容,重点了解以太网在ARM设计中的框架以及在设备树以及驱动的一个整体框架。了解作为一个驱动开发人员当拿到一款未开发过的ARM板卡应该怎么去把网卡配置使用起来。 2. 基础知识介绍 在嵌入式ARM中实现以太网的解决方案通常有以下两种…...
JavaFX使用jfoenix的UI控件
jfoenix还是一个不错的样式,推荐使用,而且也可以支持scene builder中的拖拖拽拽 需要注意的是过高的javafx版本可能会使得某些样式或控件无法使用 比如alert控件,亲测javaFX 19版本可以正常使用 1.在pom.xml中引入依赖 GitHub地址https://gi…...
Linux(Ubuntu)命令大全——已分类整理,学习、查看更加方便直观!(2024年最新编制)
Hello! 认真好学的小伙伴们,大家好呀(Respect~)!我是 H u a z z i Huazzi Huazzi,欢迎观看本篇博客,接下来让我们一起来学习 Ubuntu命令大全 吧!祝你有所收获! 文章目录 前言&#x…...
单片机:实现教学上下课的自动打玲(附带源码)
单片机实现教学上下课的自动打铃 在学校或其他教育机构中,定时的打铃系统被广泛应用,用于提醒学生和老师上下课的时间。一个简单的自动打铃系统可以通过单片机实现,结合蜂鸣器和定时器控制,可以在设定的时间点自动打铃࿰…...
进程通信方式---共享映射区(无血缘关系用的)
5.共享映射区(无血缘关系用的) 文章目录 5.共享映射区(无血缘关系用的)1.概述2.mmap&&munmap函数3.mmap注意事项4.mmap实现进程通信父子进程练习 无血缘关系 5.mmap匿名映射区 1.概述 原理:共享映射区是将文件…...
深度学习实战智能交通计数
本文采用YOLOv8作为核心算法框架,结合PyQt5构建用户界面,使用Python3进行开发。YOLOv8以其高效的实时检测能力,在多个目标检测任务中展现出卓越性能。本研究针对车辆目标数据集进行训练和优化,该数据集包含丰富的车辆目标图像样本…...
【MySQL】MySQL表的操作
【MySQL】MySQL表的操作 🥕个人主页:开敲🍉 🔥所属专栏:MySQL🍋 🌼文章目录🌼 1. 创建表 2. 查看表结构 3. 修改表 4. 删除表 1. 创建表 create table table_name(表名称)( fiel…...
Redis篇-12--数据结构篇4--Hash内存模型(数组,链表,压缩列表zipList,哈希表,短结构)
Redis的Hash数据结构用于存储键值对(key-value形式)的集合(类似java中HashMap或对象)。为了在保证高效性能的同时节省内存,Redis对Hash的底层实现进行了多种优化。特别是通过使用压缩列表(ziplistÿ…...
二、windows环境下vscode使用wsl教程
本篇文件介绍了在windows系统使用vscode如何连接使用wsl,方便wsl在vscode进行开发。 1、插件安装 双击桌面vscode,按快捷键CtrlShiftX打开插件市场,搜索【WSL】点击安装即可。 2、开启WSL的linux子系统 点击左下方图标【Open a Remote Win…...
Qwen2-VL微调体验
1.配置环境 2.数据集准备 3.模型下载 4.注册SwanLab 5.微调 6.训练过程可视化 1.配置环境 本博客使用的是2B模型,所以仅用了单卡3090,若大一点的模型,自行根据实际情况准备显卡 安装Python>3.8 安装Qwen2-VL必要的库 pip install…...
论文的模拟环境和实验环境
模拟环境和实验环境 在撰写SCI计算机领域论文时,模拟环境和实验环境是两个重要的概念,它们之间存在显著的差异。 模拟环境主要是利用计算机、数学方法等手段对实际系统进行描述和分析的过程。在计算机科学中,模拟环境可以用于模拟各种算法、系统或网络的行为,以便在不需要…...
MySQL EXPLAIN 详解:一眼看懂查询计划
在日常的数据库开发中,我们经常需要分析 SQL 查询性能,而 EXPLAIN 是 MySQL 提供的利器,可以帮我们快速理解查询计划,优化慢查询。本文将详细解析 EXPLAIN 的输出字段及其含义,并结合实际案例分享优化思路。 一、什么是…...
利用ngx_stream_return_module构建简易 TCP/UDP 响应网关
一、模块概述 ngx_stream_return_module 提供了一个极简的指令: return <value>;在收到客户端连接后,立即将 <value> 写回并关闭连接。<value> 支持内嵌文本和内置变量(如 $time_iso8601、$remote_addr 等)&a…...
黑马Mybatis
Mybatis 表现层:页面展示 业务层:逻辑处理 持久层:持久数据化保存 在这里插入图片描述 Mybatis快速入门  一、现代浏览器渲染流程(详细说明) 1. 构建DOM树 浏览器接收到HTML文档后,会逐步解析并构建DOM(Document Object Model)树。具体过程如下: (…...
Spring数据访问模块设计
前面我们已经完成了IoC和web模块的设计,聪明的码友立马就知道了,该到数据访问模块了,要不就这俩玩个6啊,查库势在必行,至此,它来了。 一、核心设计理念 1、痛点在哪 应用离不开数据(数据库、No…...
【Linux】自动化构建-Make/Makefile
前言 上文我们讲到了Linux中的编译器gcc/g 【Linux】编译器gcc/g及其库的详细介绍-CSDN博客 本来我们将一个对于编译来说很重要的工具:make/makfile 1.背景 在一个工程中源文件不计其数,其按类型、功能、模块分别放在若干个目录中,mak…...
uniapp 小程序 学习(一)
利用Hbuilder 创建项目 运行到内置浏览器看效果 下载微信小程序 安装到Hbuilder 下载地址 :开发者工具默认安装 设置服务端口号 在Hbuilder中设置微信小程序 配置 找到运行设置,将微信开发者工具放入到Hbuilder中, 打开后出现 如下 bug 解…...
第八部分:阶段项目 6:构建 React 前端应用
现在,是时候将你学到的 React 基础知识付诸实践,构建一个简单的前端应用来模拟与后端 API 的交互了。在这个阶段,你可以先使用模拟数据,或者如果你的后端 API(阶段项目 5)已经搭建好,可以直接连…...
解析两阶段提交与三阶段提交的核心差异及MySQL实现方案
引言 在分布式系统的事务处理中,如何保障跨节点数据操作的一致性始终是核心挑战。经典的两阶段提交协议(2PC)通过准备阶段与提交阶段的协调机制,以同步决策模式确保事务原子性。其改进版本三阶段提交协议(3PC…...
聚六亚甲基单胍盐酸盐市场深度解析:现状、挑战与机遇
根据 QYResearch 发布的市场报告显示,全球市场规模预计在 2031 年达到 9848 万美元,2025 - 2031 年期间年复合增长率(CAGR)为 3.7%。在竞争格局上,市场集中度较高,2024 年全球前十强厂商占据约 74.0% 的市场…...
