[WeChat] 微信小程序button点击多选/单选简单实现

微信小程序button点击多选/单选简单实现：wxss定义小程序按钮点击选中与未选中状态下的样式，多个button按钮使用wx:for展示，通过点击改变原数据下自定义的选择字段true/false来实现选中状态。1、WXML代码：<button wx:for="{{diseaseList}}" wx:key="*this" data-index=...

[WeChat] 微信小程序保存广告海报图到相册简单实现

项目开发过程中，需要用户将自己的二维码推广图片保存到手机相册，第一时间考虑使用canvas画布来生成相关海报图片，用小程序api保存到相册，因保存的图片上面带有个人相关动态参数信息，为减少前端加载时间，后改变为后端生成图片，前端调用接口方式保存。1、wxml代码：<button type="button" bindtap="saveUserQrcode&q...

[WeChat] 微信小程序获取地址位置授权及用户拒绝后处理方式

1、微信小程序获取地理位置授权，首先需要在app.json中添加配置："permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序定位，以便更好体验功能" } }2、wxml代码：<view class="m...

[WeChat] 微信小程序自动检测版本并提示更新新版本

微信小程序开发过程中，我们在版本更新迭代后，微信小程序客户端并不能触发自动更新，需要用户手动清理小程序后重新搜索进入后才能获取到最新的小程序版本，但是这个是用户所不能感知到的操作，也很麻烦，故需要提醒用户如何去获取到最新的版本，我们只需要在微信小程序app.js文件中编写以下代码即可；//app.js App({ // 小程序启动之后 触发 onLaunch: function (...

[WeChat] 微信小程序选择图片及批量上传简单实现

使用微信小程序API(wx.chooseImage)实现页面选择图片和拍照，选择后页面显示预览图，再通过小程序API(wx.uploadFile)实现图片上传，其中包括uploadOneByOne递归方式上传多张图片。WXML代码：<view class="container"> <view class="supplement-repor...

[WeChat] 微信小程序获取从明天开始一周日期(包含周几及号数)简单实现

微信小程序简单实现第二天开始一周日期，显示为周几及当天号数，点击星期可切换日期，下方显示当前选择日期，以便其他函数调用；WXML代码：<view class="choose-time-middle"> <view class="date"> <view wx:for="{{dateArray}}&qu...

[WeChat] 微信小程序简单实现两列瀑布流布局页面

实现页面瀑布流思路：使用CSS3属性column-count: number|auto;将容器元素分为两列，使用column-gap: length|normal;设置列之间的间隔，使用break-inside: avoid使元素避免出现中断点。注意：最重要的需要设置图片mode='widthFix',即设置图片宽度不变，高度自动变换，保持原图宽高比不变。wxml代码：<view cl...

[WeChat] 微信小程序中使用Echarts实现一图或多图展示

1、下载echarts微信版，地址：https://github.com/ecomfe/echarts-for-weixin2、将下载好的文件ec-canvas目录放在小程序项目根目录中即可3、在页面使用echarts的话，需要在index.json中添加以下配置(以下为整个json配置)：{ "navigationBarTitleText": "echar...

[WeChat] 微信小程序自定义页面手动授权拉取用户信息

WXML代码：<view bindtap="authorLogo">立即登录</view> <view class="author-modal" hidden="{{authorModal}}"> <!-- 授权登录 --> <view wx:if="...

[WeChat] 微信小程序简单实现上拉触底onReachBottom数据分页请求

实现思路：通过小程序上拉触底onReachBottom事件触发数据第二次请求，上拉触底一次请求分页页码加一，每次请求10条数据，在请求函数中通过函数concat来处理数据累加问题，common.WechatRequest为封装的小程序wx.request函数。WXML代码：<view hidden="{{noDataPrompt}}"> {{promp...