开篇 今天,做的小程序项目要求,个人中心的客服图片在用户长按时可以识别其二维码,各种翻阅查找,采坑很多,浪费了很多时间,在这里记录下需要注意的点,以及对小程序官方提供的API做一个正确和清晰的认知,希望能帮助到大家 参考小程序官方文档后,发现: .文档中有一句提示: "image组件中二维码/小程序码图片不支持长按识别,仅在 wx.previewImage 中支持长按识别" .即便实现了 “wx.previewImage” 效果,但依旧是不支持二维码识别的 代码 ①. wxml 页面元…
微信小程序点击图片放大预览使用到 wx.previewImage 接口,可以放大.上/下一张 上代码 wxml代码 <view class='content-img' wx:if="{{images}}" > <view wx:for="{{images}}"> <image src="{{item}}" data-src="{{item}}" bindtap="previewImage…
需求:由于后台服务器各方面的限制,现在服务器返回的图片是base64格式的,小程序端需要支持预览图片和多个图片一键下载功能 一.如何预览base64位图片? WXML页面:item.src的值是base64编码的字符串 <block wx:for="{{imgsLength}}" wx:key="index"> <image mode="widthFix" bindtap="preImg" src="…
问题描述: 正常情况下,打开微信小程序开发工具后,首页提示扫描二维码进行登陆,但是如果不显示二维码,当然无法登陆. 解决方案: 无法显示二维码肯定是程序运行哪里出错了,我们直接点击桌面图标是无法排查错误,所以需要切换至命令行进行启动. 打开命令行,进入如下目录 /Applications/wechatwebdevtools.app/Contents/MacOS 执行目录下的程序 ./wechatwebdevtools 显示错误信息如下 [827:32515:0325/101822.447917:…
下拉刷新 实现下拉刷新目前能想到的有两种方式 1. 调用系统的API,系统有提供下拉刷新的API接口 当然,你可以直接在全局变量app.json的window里面配置上面这个属性,这样整个项目都允许下拉刷新了,因为系统默认是不具备下拉刷新功能的  2. 监听scroll-view,自定义下拉刷新,还记得scroll-view里面有一个bindscrolltoupper属性吗?忘记请自行回顾上一篇微信小程序实战篇-电商(二)当滚动到顶部/左边,会触发 scrolltoupper 事件,所以我们可以…
本期的微信小程序实战篇来做一个电商网站经常用到的-商品属性联动选择的效果,素材参考了一点点奶茶. 效果演示:   商品属性联动.gif 代码示例 1.commodity.xml <!-- <view class="title">属性值联动选择</view> --> <!--options--> <view class="commodity_attr_list"> <!--每组属性--> <…
电商底部导航栏的制作 我想大家对电商一定不陌生,一般电商的底部导航栏有以下几个首页.分类.购物车.个人中心. app.json是用来配置page路径以及导航栏属性的,那我们要做首页.分类.购物车.个人中心界面就要在page也添加这几个界面,所以在app.json的page里添加如下代码,写入page路径,系统会自动帮你创建界面的 "pages":[ "pages/home/home", "pages/classify/classify", &qu…
前言 微信小程序图表插件(wx-charts)是基于canvas绘制,体积小巧,支持图表类型饼图.线图.柱状图 .区域图等图表图形绘制,目前wx-charts是微信小程序图表插件中比较强大好使的一个.   订单报表.gif 如上图所示,我们基于wxcharts.js 来实现订单统计报表. 导入wxcharts.js   3.pic.jpg 将wxcharts.js 存放在utils目录 column.wxml <view class="container"> <!--…
1:真机预览时上传组件的坑: 当在真机里面使用上传组件,当进入选择相片或者拍照的时候,小程序会进入后台,调用APP onHide()方法,选择完返回小程序是会调用App Onshow()方法,然后调用主页js里面的onshow()方法. 而本地开发工具测试时并不会出现这种情况,这将导致如果你在主页js onshow里面写了初始化数据的话,在真机预览状态下可能会给你带来不小的麻烦,会把你并不想清掉的数据的时候把数据清掉,如果要初始化最好是在整个页面数据处理完以后,并不能再onShow()方法里面,…
下拉刷新 实现下拉刷新目前能想到的有两种方式 1. 调用系统的API,系统有提供下拉刷新的API接口 2. 监听scroll-view,自定义下拉刷新,还记得scroll-view里面有一个bindscrolltoupper属性吗?当滚动到顶部/左边,会触发 scrolltoupper 事件,所以我们可以利用这个属性,来实现下拉刷新功能. 两种方法都可以,第一种比较简单,易上手,毕竟一些逻辑系统已经给你处理好了,第二种适合那种想要自定义下拉刷新样式的小程序,初识就用第一种,系统提供的就好.以首页…