欢迎来到258分享网,纯净的网络源码分享基地！

登录注册 QQ登录

金币充值帮助中心

258资源分享网

热门搜索：　织梦　农业种植　农业　安全设置　官方

258资源分享 > 建站学院 > 微信开发 > 微信小程序日历组件开发，图片失真的解决方案

购买VIP 金币充值

分类

织梦教程帝国教程 discuz教程微信开发 MYSQL教程 MSSQL教程网站运营 ecshop教程前端教程 Phpweb教程 php编程服务器架设 ASP编程脚本编程

推荐文章

推荐下载

HTML5响应式自适应网咯设计

2020-05-12 浏览：789

HTML5自适应律师工作室类网

2020-04-04 浏览：654

高端HTML5响应式企业通用网

2020-05-06 浏览：560

html5响应式外贸网站英文版

2020-05-08 浏览：545

HTML5影视传媒文化公司类网

2020-05-12 浏览：543

微信小程序日历组件开发，图片失真的解决方案

发布时间:2020-12-01

分享者：AaronW
效果图：

微信小程序日历组件开发，图片失真的解决方案

由于微信小程序特性的限制，js文件不能直接操作wxml文件，即不能进行dom操作，所以在此创建组件必须先把组件结构定义好，即在wxml文件中先定义好组件结构，然后再绑定数据，根据js文件中的数据进行动态渲染。这里的日历由两部分组成，一是上部红色，而是下面主要日历部分。上部直接绑定数据。
下部分实现方式：
第一行星期的显示，此处为固定显示，无需js操作。然后下面的日历body部分，由于每周七天，绑定的数据可根据此生成，根据当前日期生成每行的数据。
日期生成：
取当前月第一天，得到星期，计算上月在第一行的日期，如下图红色框中的部分：

以当前日期为例，本月一号位周六，当前月份可显示上个月6天；计算当前月(或指定月份)最后一天的星期天数，取得下个月可在本月显示日期。最后合并本月日期，并按每行七日排列，即可生成当前月分的日历数据。以下贴出代码：
wxml代码：

<view class="calendar" bindtap="tap">

<view class="calendar-panel">

<view class="day">{{canlender.date}}日</view>

本文标签

程序微信组件开发图片解决方案日历

上一篇：微信小程序操作数组时，下标不支持变量；module.exports和exports的区别 ...
下一篇：微信公众号菜单配置小程序简易教程