uniapp——列表选择样式
案例

代码
<view class="list"><block v-for="(item,index) in 8" :key="index"><view class="item" @click="choosePackage(item)" :class="{'active':item == current}"><view class="i_money"><text class="i_num">2</text>元</view><view class="i_txt">套餐</view></view></block>
</view>
export default {components: {},data() {return {current: 0,};},watch: {},onLoad() {},onShow() {},methods: {choosePackage(item) {console.log(item);this.current = item}}
}
.list {margin-top: 44rpx;display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: 16px 14px; //行间距 列间距.item {background: #FFFFFF;border-radius: 10rpx 10rpx 10rpx 10rpx;border: 1rpx solid #BCBCBC;display: flex;flex-direction: column;justify-content: center;align-items: center;padding: 20rpx 0;.i_money {font-weight: bold;font-size: 22rpx;color: #292929;.i_num {font-size: 30rpx;}}.i_txt {font-size: 22rpx;color: #292929;margin-top: 5rpx;}}.active {background: #FFFDFA;border: 1rpx solid #FE8300;position: relative;}.active::before {content: '';position: absolute;right: 5rpx;top: 6rpx;width: 12rpx;height: 9rpx;border-right: 2rpx solid #FFFFFF;border-top: 2rpx solid #FFFFFF;transform: rotate(135deg);z-index: 2;}.active::after {content: '';position: absolute;right: 0;top: 0;border-radius: 0 6rpx 0 10rpx;width: 26rpx;height: 26rpx;background-color: #FE8300;}}
相关文章:
uniapp——列表选择样式
案例 代码 <view class"list"><block v-for"(item,index) in 8" :key"index"><view class"item" click"choosePackage(item)" :class"{active:item current}"><view class"i_money&q…...
解决客户访问超时1s问题
访问公网地址返回状态码499-CSDN博客 需求描述 客户访问公司公网服务,期望在1s内完成。他们在客户端设置了超时1s的配置,如果超过1s公司服务就会报错499,这是正常的请求返回。 这里是业务简易的连路图: 分析问题 目前这个服务通过公网的alb负载均衡到ecs,通过ecs再转发…...
Linux命令(基础面试可用,都是自己觉得平时使用多的)
1.cat 参数:-n:显示行号-s:压缩连续的空行,只显示一个空行2.chattr 改变文件属性 语法:chattr [-RV] [/-/<属性>][文件或目录] 属性:a:让文件或目录仅供附加用途i:不得任意更…...
opencv-python图像增强一:传统图像去噪方法整理
一、简介: 在数字图像处理领域,噪声一直是影响图像质量的重要因素。无论是拍摄过程中的环境干扰,还是传输过程中的信号失真,噪声都可能导致图像模糊、细节丢失,甚至影响后续的图像分析和应用。为了提高图像的视觉效果…...
Canal单机部署
目录 一、前期准备 1、配置binlog日志 2、配置MQ服务 二、搭建canal 1、下载安装包 2、部署canal-admin的UI管理界面 2-1、创建&解压admin 2-2、配置UI管理界面 2-3、初始化元数据库 2-4、启动Canal Admin 3、部署canal-server服务 3-1、创建&解压deployer…...
java,每日练习02
题目 选自牛客网 1.下列关于Java中类的构造方法的描述,正确的是() A.构造方法的返回类型为void B.可以定义一个类而在代码中不写构造方法。 C.在同一个类中定义的重载构造方法不可以相互调用。 D.子类不允许调用父类的构造方法。 正确答案…...
C# TreeView
添加 TreeView 控件:定义节点:添加节点:设置节点属性:处理节点事件:自定义节点绘制:数据绑定:节点选择:节点展开和折叠:搜索和过滤:示例代码总结 C# 中的 Tre…...
通过xshell使用密钥连接阿里云服务器
目录 步骤1:创建密钥对 步骤2:连接服务器 步骤3:连接服务器 连接阿里云服务器有几种方式,例如有密码进行连接,但是密码连接安全风险较大,所以我们选择密钥方式进行连接。操作简单且安全性高 步骤1&…...
<数据集>路面坑洼识别数据集<目标检测>
数据集格式:VOCYOLO格式 图片数量:681张 标注数量(xml文件个数):681 标注数量(txt文件个数):681 标注类别数:1 标注类别名称:[pothole] 使用标注工具:labelImg 标注规则:对类…...
几个常用脚本
系统初始化 #!/bin/bash # 定义颜色常量 RED\033[0;31m GREEN\033[0;32m NC\033[0m # No Color #功能菜单 menu() {clearecho "请选择要执行的操作:"echo "1. 检查网络"echo "2. 关闭防火墙和SELinux"echo "3. 替换YUM源"echo "…...
gtest中TEST和TEST_F和TEST_P的区别是什么
gtest(Google Test)是Google开发的一个开源的C测试框架,它提供了多种宏来支持不同类型的测试。其中,TEST、TEST_F和TEST_P是三个常用的宏,它们各自有不同的用途和特性。以下是它们之间的主要区别: TEST 用…...
VS2022如何调出输出窗口,并在输出窗口打印日志
在输出窗口打印 System.Diagnostics.Debug.WriteLine("这是一行自定义的输出。Debug.WriteLine");System.Diagnostics.Debug.Write("这是第二行自定义的输出,Debug.Write");System.Diagnostics.Debug.WriteLine("换行");System.Diagn…...
【全国大学生电子设计竞赛】2021年I题
🥰🥰全国大学生电子设计大赛学习资料专栏已开启,限时免费,速速收藏~...
【项目】基于Vue2+Router+Vant 前端面经项目
环境配置 Vue脚手架的创建 在终端中打开输入 vue create 项目包名 -m npm注意⚠️:项目名称不再允许包含大写字母。 选择第三项 3.选择要安装的模块 从上到下的功能模块: Babel - ES:降级处理Router-Vue:路由插件CSS预处理器E…...
【论文阅读】YOLOv10: Real-Time End-to-End Object Detection
题目:YOLOv10: Real-Time End-to-End Object Detection 作者:Ao Wang Hui Chen∗ Lihao Liu Kai Chen Zijia Lin Jungong Han Guiguang Ding∗ 清华大学的 motivation: 作者觉得YOLO系列的NMS和某些结构非常的耗时,提出NMS-free和一些列高效…...
计算资源消耗
计算资源消耗 计算资源的消耗分成: 模型参数本身的存储。模型参数的梯度以及梯度momentum的存储。token的传播过程 例如以llama3-7b为例: 模型参数存储: 模型参数量 * fp32 例如llama3-70b为例,7 * 10^9 * 4 模型参数的梯度以…...
企业微信推送消息的Java实现教程
在这篇教程中,我们将介绍如何使用Java实现企业微信的消息推送功能,特别是在完成任务后,将结果信息通过企业微信推送给指定的用户。我们将基于您提供的代码进行说明。 1. 环境准备 1.1 依赖库 在开始编写代码之前,确保您的项目中…...
强化学习之Actor-Critic算法(基于值函数和策略的结合)——以CartPole环境为例
0.简介 DQN算法作为基于值函数的方法代表,基于值函数的方法只学习一个价值函数。REINFORCE算法作为基于策略的方法代表,基于策略的方法只学习一个策略函数。Actor-Critic算法则结合了两种学习方法,其本质是基于策略的方法,因为其目…...
Linux学习记录(五)-------三类读写函数
文章目录 三种读写函数1.行缓存2.无缓存3.全缓存4.fgets和fputs5.gets和puts 三种读写函数 1.行缓存 遇到新行(\n),或者写满缓存时,即调用系统函数 读:fgets,gets,printf,fprintf,sprintf写:fputs,puts,scanf 2.无缓…...
2024年8月13日(lvs NAT脚本 RS脚本 ds脚本)
lvs-nat模式的优点配置简单,缺点是请求和响应都必须经过ds,容易称为性能瓶颈 希望有这样的模式,请求的时候使用input链进行负载均衡,响应的时候就不要经过ds,直接由rs响应给客户端 在nat模式的时候,请求vip,接收vip的响应 构想 请求vip,接受rip响应,这是不允许lvs-dr模式 NAT脚…...
docker详细操作--未完待续
docker介绍 docker官网: Docker:加速容器应用程序开发 harbor官网:Harbor - Harbor 中文 使用docker加速器: Docker镜像极速下载服务 - 毫秒镜像 是什么 Docker 是一种开源的容器化平台,用于将应用程序及其依赖项(如库、运行时环…...
ios苹果系统,js 滑动屏幕、锚定无效
现象:window.addEventListener监听touch无效,划不动屏幕,但是代码逻辑都有执行到。 scrollIntoView也无效。 原因:这是因为 iOS 的触摸事件处理机制和 touch-action: none 的设置有关。ios有太多得交互动作,从而会影响…...
什么是Ansible Jinja2
理解 Ansible Jinja2 模板 Ansible 是一款功能强大的开源自动化工具,可让您无缝地管理和配置系统。Ansible 的一大亮点是它使用 Jinja2 模板,允许您根据变量数据动态生成文件、配置设置和脚本。本文将向您介绍 Ansible 中的 Jinja2 模板,并通…...
Mobile ALOHA全身模仿学习
一、题目 Mobile ALOHA:通过低成本全身远程操作学习双手移动操作 传统模仿学习(Imitation Learning)缺点:聚焦与桌面操作,缺乏通用任务所需的移动性和灵活性 本论文优点:(1)在ALOHA…...
Java求职者面试指南:Spring、Spring Boot、MyBatis框架与计算机基础问题解析
Java求职者面试指南:Spring、Spring Boot、MyBatis框架与计算机基础问题解析 一、第一轮提问(基础概念问题) 1. 请解释Spring框架的核心容器是什么?它在Spring中起到什么作用? Spring框架的核心容器是IoC容器&#…...
MFC 抛体运动模拟:常见问题解决与界面美化
在 MFC 中开发抛体运动模拟程序时,我们常遇到 轨迹残留、无效刷新、视觉单调、物理逻辑瑕疵 等问题。本文将针对这些痛点,详细解析原因并提供解决方案,同时兼顾界面美化,让模拟效果更专业、更高效。 问题一:历史轨迹与小球残影残留 现象 小球运动后,历史位置的 “残影”…...
c# 局部函数 定义、功能与示例
C# 局部函数:定义、功能与示例 1. 定义与功能 局部函数(Local Function)是嵌套在另一个方法内部的私有方法,仅在包含它的方法内可见。 • 作用:封装仅用于当前方法的逻辑,避免污染类作用域,提升…...
DeepSeek源码深度解析 × 华为仓颉语言编程精粹——从MoE架构到全场景开发生态
前言 在人工智能技术飞速发展的今天,深度学习与大模型技术已成为推动行业变革的核心驱动力,而高效、灵活的开发工具与编程语言则为技术创新提供了重要支撑。本书以两大前沿技术领域为核心,系统性地呈现了两部深度技术著作的精华:…...
高防服务器价格高原因分析
高防服务器的价格较高,主要是由于其特殊的防御机制、硬件配置、运营维护等多方面的综合成本。以下从技术、资源和服务三个维度详细解析高防服务器昂贵的原因: 一、硬件与技术投入 大带宽需求 DDoS攻击通过占用大量带宽资源瘫痪目标服务器,因此…...
在 Visual Studio Code 中使用驭码 CodeRider 提升开发效率:以冒泡排序为例
目录 前言1 插件安装与配置1.1 安装驭码 CodeRider1.2 初始配置建议 2 示例代码:冒泡排序3 驭码 CodeRider 功能详解3.1 功能概览3.2 代码解释功能3.3 自动注释生成3.4 逻辑修改功能3.5 单元测试自动生成3.6 代码优化建议 4 驭码的实际应用建议5 常见问题与解决建议…...
