微信小程序radio单选按钮选中与取消

news2024/9/21 5:44:22

 

 

 wxml

<view bindtap='checkedTap'>
      <radio checked="{{checked}}">设为默认</radio>
</view>

wxss

<style lang="less" >
radio .wx-radio-input {
  border-radius: 50%; /* 圆角 */
  width: 24rpx;
  border: 2rpx solid #5e5e5f;
  height: 24rpx;
}
radio .wx-radio-input.wx-radio-input-checked {
  border: none;
  background: #c1885a;
}
radio .wx-radio-input.wx-radio-input-checked::before {
  border-radius: 50%; /* 圆角 */
  width: 28rpx; /* 选中后对勾大小,不要超过背景的尺寸 */
  height: 28rpx; /* 选中后对勾大小,不要超过背景的尺寸 */
  line-height: 28rpx;
  text-align: center;
  font-size: 20rpx; /* 对勾大小 30rpx */
  color: #fff; /* 对勾颜色 白色 */
  background: #c1885a;
  transform: translate(-50%, -50%) scale(1);
}
</style>

在点击事件中,通过取反即可实现选中与取消。 

js 

 data: {
    checked:true
  },
  //是否选中
  checkedTap: function () {
    this.setData({
      "checked": !this.data.checked
    })
  },

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/802505.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

网安周报 | 银行业成为开源软件供应链攻击的目标

网安周报是棱镜七彩推出的安全资讯专栏&#xff0c;旨在通过展示一周内发生的与开源安全、软件供应链安全相关攻击事件&#xff0c;让用户了解开源及软件供应链威胁&#xff0c;提高对安全的重视&#xff0c;做好防御措施。 1、银行业成为开源软件供应链攻击的目标 网络安全研…

nn.BCELoss与nn.CrossEntropyLoss

BCELoss与CrossEntropyLoss都是用于分类问题。可以知道&#xff0c;BCELoss是Binary CrossEntropyLoss的缩写&#xff0c;BCELoss是CrossEntropyLoss的一个特例&#xff0c;只用于二分类问题&#xff0c;而CrossEntropyLoss可以用于二分类&#xff0c;也可以用于多分类&#xf…

文档管理NAS储存安全吗?

关键词&#xff1a;私有化、知识管理系统、文档管理、群晖NAS、协同编辑 随着企业不断发展扩大&#xff0c;企业的知识文档也逐渐增多&#xff0c;很多企业方便管理及考虑数据安全问题会将文件数据储存至NAS。 但将企业文档数据放在NAS上就足够安全的吗&#xff1f; 天翎文档管…

【快应用】通用方法getBoundingClientRect的使用

【关键词】 快应用开发、通用方法、getBoundingClientRect 【背景】 快应用通用方法中提供了getBoundingClientRect方法来获取当前组件的布局位置&#xff0c;之前处理的快应用问题中&#xff0c;有个cp却把这种场景误解为可以获取到文字的宽度和高度&#xff0c;这是不合理的…

在线平面设计工具盘点,提升效率首选

在移动应用程序或网页UI设计项目中&#xff0c;在线平面图工具是必不可少的。市场上的在线平面图工具绘制软件丰富多样&#xff0c;层出不穷。作为一名UI设计师&#xff0c;有必要了解哪些在线平面图工具既简单又专业。本文将分享6种在线平面图工具&#xff0c;每种在线平面图工…

Vue 加载远程组件的解决方案

背景 最近的项目有一个加载远程组件的需求。基于此我对 Vue 加载远程组件的方案进行了研究&#xff0c;并且整理了两个可行的解决方案。 HTML 文件 umd 组件 这个方案是最简单、最容易实现的。组件以 umd 的格式进行打包&#xff0c;然后在 HTML 文件中直接使用。 <div…

Glide原理分析

工程目录图 Glide源码分析 - 缓存源码分析 活动缓存 &#xff1a;当前activity有效内存缓存&#xff08;LRU算法&#xff0c;核心linkhashmap&#xff09;,当前运行的整个app生命周都有效&#xff0c;有大小限制&#xff0c;防止app oom磁盘缓存&#xff0c;整个app都有效&…

汇编语言(第4版)实验9 根据材料编程

参考答案&#xff1a; ①经分析&#xff0c;完整程序代码如下。 assume cs:codesg,ds:datasgdatasg segment db welcome to masm! datasg endscodesg segment start: mov ax,0b800hmov es,axmov si,0722hmov ax,datasgmov ds,axmov cx,16mov bx,0s: mov al,ds:[bx]mov ah,0…

语音识别 — 特征提取 MFCC 和 PLP

一、说明 语音识别是一种技术&#xff0c;通过计算机和软件系统&#xff0c;将人们的口头语言转换为计算机可读的文本或命令。它使用语音信号处理算法来识别和理解人类语言&#xff0c;并将其转换为计算机可处理的格式。语音识别技术被广泛应用于许多领域&#xff0c;如语音助手…

Spring学习之Spring启示录

文章目录 OCP开闭原则依赖倒置原则控制反转依赖注入DI OCP开闭原则 什么是OCP&#xff1f; OCP是软件七大开发原则当中最基本的一个原则&#xff1a;开闭原则对什么开&#xff1f;对拓展开对什么闭&#xff1f;对修改关系 如果为了一个功能拓展&#xff0c;需要修改之前运行良…

项目播报 | 新基德携手璞华易研PLM,打造企业新一代研发管理平台

近日&#xff0c;“新基德PLM&#xff08;Product Lifecycle Management&#xff0c;产品生命周期管理&#xff09;项目”在新基德&#xff08;深圳&#xff09;电子有限公司&#xff08;以下简称&#xff1a;新基德&#xff09;正式启动。新基德是一家集手机研发、生产、销售、…

2023 数字生态发展大会,和鲸 ModelWhale 入选中国信通院“铸基计划”《高质量数字化转型产品及服务全景图》

7月27日&#xff0c;由中国信通院主办的“2023数字生态发展大会”暨中国信通院“铸基计划”年中会议在北京召开。本次大会重磅发布了《高质量数字化转型产品及服务全景图&#xff08;2023&#xff09;》&#xff0c;和鲸科技旗下数据科学协同平台 ModelWhale 成功入选&#xff…

android jetpack DataStore(java)代替SharedPreferences

目录 Preferences DataStore 怎么用&#xff1f;导入依赖创建 Preferences DataStore读取内容写入内容 Proto DataStore怎么用&#xff1f;导入依赖创建proto创建Serializer使用DataStore DataStore 提供两种不同的实现&#xff1a;Preferences DataStore 和 Proto DataStore。…

【C语言进阶】重新认识字符型变量

引例 首先我们看一个简单的例子 #include <stdio.h> #include <stdlib.h>int main() {double x4 2023.727;char c (int)x4 / 10;printf("c%6c\tc%6hd\n",abs(c),abs(c));return 0; } }这小例子的结果是多少呢&#xff1f; 结果是 “c 6 c 54” 有知…

医学案例|单因素重复测量方差

一、案例介绍 为研究某诱导方法对患者收缩压的影响&#xff0c;将手术要求基本相同的15名患者&#xff0c;在手术过程中采用A麻醉诱导方法&#xff0c;并在T0&#xff08;诱导前&#xff09;、T1、T2、T3、T4五个时刻测量患者的收缩压&#xff0c;试着进行方差分析。 二、问题…

小程序相较于APP,广告变现有哪些优势?

对于开发者而言&#xff0c;微信小程序开发门槛相对较低&#xff0c;难度不及APP&#xff0c;能够满足简单的基础应用&#xff0c;适合生活服务类线下商铺以及非刚需低频应用的转换。 和早期相比&#xff0c;今天小程序在产品功能、UI设计、交互体验等方面&#xff0c;越来越精…

python_day16_装饰器

装饰器基础写法 def outer(func):def inner():print("睡眠")func()print("起床")return innerdef sleep():import timeprint("睡眠中、、、")time.sleep(5)f1 outer(sleep) f1()装饰器语法糖 def outer(func):def inner():print("休息一…

Inpaint Anything: 自动化抹除视频元素

自动化抹除视频元素 不用逐帧抠图&#xff0c;直接SAM Tracking Video Inpainting就能实现自动化抹除奔跑吧idol。 https://github.com/geekyutao/Inpaint-Anything 目录 网站演示参考文献 网站 https://huggingface.co/spaces/InpaintAI/Inpaint-Anything 演示 原理就是&a…

Bert经典变体学习

ALBert ALBERT就是为了解决模型参数量大以及训练时间过长的问题。ALBERT最小的参数只有十几M, 效果要比BERT低1-2个点&#xff0c;最大的xxlarge也就200多M。可以看到在模型参数量上减少的还是非常明显的&#xff0c;但是在速度上似乎没有那么明显。最大的问题就是这种方式其实…

力扣算法递归类—(链表)两数相加

目录 2. 两数相加 题解&#xff1a; 知识点&#xff1a; 链表定义&#xff1a; 链表赋值&#xff1a; 链表题小技巧&#xff1a; 代码&#xff1a; 结果&#xff1a; 给你两个 非空 的链表&#xff0c;表示两个非负的整数。它们每位数字都是按照 逆序 的方式存储的&…