更新记录

1.0(2022-04-10)

第一次提交


平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
× × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×



先上图

在这里插入图片描述 在这里插入图片描述 在这里插入图片描述

前言

最近项目需要一个多选且互斥的优惠券组件,找了好久,发现并没有于是决定自己撸起袖子造一个 (互斥比如说二个优惠券A,B选A,就不能选B,选B就不能选A)

实现思路

  • 1 先写单选优惠券组件

  • 2 单选优惠券添加复选框

  • 3复选框组件是否勾选由数据里面的checked决定

    javascript checked: false||true

  • 4 动态改变每个优惠券里面的checked就能实现多选效果

  • 5 优惠券选中状态改变时候判断,循环判断每个优惠券的右上角可叠加提示和左下角的不可叠加提示是否显示显示即可

  • 6获取所有checked为true的优惠券就是用户勾选的

源码下载

github nx-coupon

Dcloud插件市场 nx-coupon

插播

承接,毕业设计,前端页面,后端接口,网站,小程序,APP开发,价格美丽,点击 QQ => 2214904953 自动加好友

作者相关文章

反编译获取任何微信小程序源码——看这篇就够了

零成本,零基础搭建获利的影视小程序

零基础搭建智能垃圾分类小程序(可做毕设,可加入流量主,赚取零花钱)

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问