更新记录

1.7.3（2021-11-25）

更新了失效后的样式，并且对按钮点击功能做了判断，已失效的优惠券点击时会提示已失效，并且不会触发领取功能

1.7.2（2021-10-22）

新增了一些属性，可以动态的修改自己想要的样式，更加自由灵活

1.7.1（2021-09-09）

内部代码重写，更加简洁，只保留了核心的样式，取消了乱七八槽的功能

平台兼容性

前言

你们的使用、评论与收藏，是我更新组件的动力。同时我会尽量保证代码的简洁性，让你们能读懂源码，希望我的组件源码，能给到你们一些学习上的帮助，谢谢

有问题，或者想和我讨论一下小程序的一些问题，可以添加我的qq（1113237401）好友哦。感谢阅读

使用

引入

 <lgf-coupon></lgf-coupon>

lgf-coupon属性

coupons数据示例

<lgf-coupon :coupons="coupons"></lgf-coupon>
coupons:{
    type:Array,
    default:[
    {
        couponName:'无门槛优惠券',
        expire:'2020-12-12 12:12:00至2020-12-12 12:12:00',
        discount:15,
        limit:'仅限于xxx使用',
        btn:'领取',
        state:null
    },{
        couponName:'无门槛优惠券',
        expire:'今日到期',
        discount:15,
        limit:'仅限于xxx使用',
        btn:'领取',
        state:"expired"
    },{
        couponName:'无门槛优惠券',
        expire:'今日到期',
        discount:15,
        limit:'仅限于xxx使用',
        btn:'去使用',
        state:"used"
    }]
}

coupons属性描述

事件

getCoupon

领取优惠券时使用

<lgf-coupon @getCoupon="getCoupon"></lgf-coupon>

getCoupon(item){
    //这是点击领取优惠券时触发的事件
}