uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。

今日给大家分享一款基于uniapp封装的每日签到页面模板组件，主打就是简单容易上手，巨好用。支持各家小程序应用平台，也支持vue2、vue3开发。

直接通过插件市场，引入到uni_modules目录即可。同时也支持自定义为系统组件使用。

<template><view><gb-qiandao :days="days" :play_number="play_number" :search_number="search_number" :full_ad="full_ad":taskList="taskList" :completeDay="completeDay" :dayList="dayList" :rule="rule" :taskStatus="taskStatus"@receiveMoney="receiveMoney" @listTab="listTab"></gb-qiandao></view>
</template><script>export default {data() {return {// 签到天数days: 0,// 签到任务第一个play_number: 0,// 签到任务第二个search_number: 0,// 签到任务第三个full_ad: 0,// 已完成天数completeDay: 0,// 签到状态 0.代表未签到 1.代表已签到taskStatus: 0.,// 签到规则rule: '这里是签到规则，你可以任意编辑',// 签到任务奖励数组dayList: [1, 1, 2, 3, 5, 6, 7],// 签到任务taskList: [{title: '试玩游戏',img: '../../static/yx.png',number: 1,dec: '完成游戏赚相关游戏'},{title: '试玩应用',img: '../../static/zl.png',number: 1,dec: '完成应用赚相关任务'},{title: '观看广告',img: '../../static/kgg.png',number: 10,dec: '观看广告赚相关广告'}]}},onLoad() {this.getData()},methods: {// 获取用户签到得相关信息，自己写接口获取即可getData() {},// 签到并领取奖励receiveMoney() {uni.showToast({title: "签到成功并获得奖励",icon: 'none',position: 'bottom'})},// 签到任务完成listTab(i) {if (i == 0) {uni.showToast({title: "跳转第一个任务",icon: 'none',position: 'bottom'})}if (i == 1) {uni.showToast({title: "跳转第二个任务",icon: 'none',position: 'bottom'})}if (i == 2) {uni.showToast({title: "跳转第三个任务",icon: 'none',position: 'bottom'})}}}}
</script><style></style>