WeChat applet realizes check-in calendar function

Preface

Because I have to sign in, I have to write a calendar.

There is only a basic calendar, and check-in needs to be implemented by yourself.

(I will also implement sign-in later...)

Related learning recommendations:WeChat Mini Program Development Tutorial

Rendering

##wxml

    {{ item }}   {{ item.day }}    

wxss

.calendar{ margin-top: 10%;}.month{ display: flex; flex-flow: row wrap; font-size: 1.1rem; }.item{ width: 14.28%; text-align: center; line-height: 3rem;}.othe{ color: grey}

js

// pages/sing_in/sing_in.jsPage({ data: { dateData: [], isSignin: false, week: ['日','一','二','三','四','五','六'], }, onLoad: function (options) { this.initCurrMonthData() }, /** * year string 年 如:2020 * month string 月 如: 5 * return array 所有天数 如:[1,2,3...,31] **/ monthDays(year,month){ let days_count = new Date(year,month,0).getDate() //月总天数 如:31 let days = []; //存放月的天数 for(let i = 1; i this.formatDay(val)) //当月的数据 for(let i = 0; i

Related learning recommendations:

WeChat public account development tutorial

The above is the detailed content of WeChat applet realizes check-in calendar function. For more information, please follow other related articles on the PHP Chinese website!