转眼间坚持写教你微信小程序系列已经有十节系列课程了,每天的工作压力繁重,小女子也不知道自己还能坚持这样的系列教程多久.只希望每篇教程真的对大家有帮助.这节课我们要介绍的就是如何实现分页的下拉加载,我们先来看效果图 1 2 3 4 5 6 7 8 <view class="copyright">     <view class="copyright_item">CopyRight:All Right Reserved</view>…

微信小程序视图层提供了 模板(template),可以在模板中定义代码片段,然后在不同的地方调用.结果在数据渲染那懵逼了.按照官网上对模板的说明和对数据的加载. 1.定义模板 使用name属性,作为模板的名字.然后在<template/>内定义代码片段,如: <!-- index: int msg: string time: string --> <template name="msgItem"> //此处的name 有ID的意味,便于其他页面加载该…

小程序不支持h5中的onerrorimg,只开放了binderror属性,当错误发生时,会发布到 AppService,事件对象event.detail = {errMsg: 'something wrong'}. 网上查了下,没有什么好的解决方法,找了几个案例结果都没有实现想要的效果. 结合前边看过的案例,大部分都是采用修改数据源将错误图片替换为默认图片的,但是有好多代码都没贴全,以致不好理解. 下面就根据自己遇到的情况对图片为空.图片路径错误的情况进行了处理,相关代码如下,相关数据都有说明:…

1.上拉加载失效 问题背景:部分页面上拉加载失效.当使用flex布局,底部固定,中间采用自适应撑满全屏实现滚动时,发现上拉加载失效,不知道是什么原因. 解决问题: 在小程序中,官方为我们提供了原生的下拉刷新和上拉加载,只需要进行简单的配置即可实现下拉刷新的功:onPullDownRefresh.onReachBottom 除此之外,还可以使用 scroll-view 组件来实现这两个功能,利用scroll-view的bindscrolltolower.bindscrolltoupper事件 <s…

前言: 业务需求,这次需要做一个小程序同时选中三张图片一起上传到服务端,后端使用的.NET WEBAPI接收数据保存. 使用技术: 在这章中将会使用到微信小程序wx.uploadFile(Object object) 和wx.chooseImage(Object object)接口,对图片大小和来源进行上传 wx.chooseImage() 概述: 从本地相册选择图片或使用相机拍照,详细了解请阅读微信小程序开发文档(https://developers.weixin.qq.com/minipro…

需求   移动端使用angular实现上拉加载更多的条目,这个需求比较常见,网上的插件改动起来比较麻烦,不如自己写一个最适合,以前有同事写了一个,奈何bug太多,后来改分页了,我们产品说什么都让做,没办法,只能自己动手写一下,需要自定义指令,我的思路就是当页面第一次加载的时候我们先固定请求一部分数据进行显示,之后使用js探测垂直滚动条的滚动距离,当页面即将触底的时候发送第n+1请求,为防止在请求过程中重复请求加入了截流判断,其次在请求过程中页面最底部出现加载等待动画.如图所示 指令实现 // i…

1.小程序方法是异步的,开发过程要注意此点,避免在需要同步执行过程中的错误,尤其是在app.js处理登入的时候要特别注意. 2.小程序api.组件依赖微信的版本,注意版本的兼容,可以通过版本判断当前的微信支不支持小程序的功能. 3.小程序的开发编辑器与真机上有小差异,开发过程尽量在手机上看效果. 4.小程序canvas在绘图时,在开发编辑器上能实现的效果(层级上可以盖住canvas),不一定能在手机上实现(手机上canvas是最高级): 5.小程序<img> 组件动态设置图片时,用setDat…

最近公司有一个小程序开发项目,自己也自学了不少,有一些开发小心得,记录在这里. 小程序开发中注意: 1,setData 小程序视图层和逻辑层在两个独立的模块,并不具备数据直接传递的,setData相当于他们的桥梁.常见的setData操作错误有三种. (1),频繁的去setData:在开发过程中,尽量少的去setData,大量的setData数据会导致页面卡顿或下拉延时等. (2),setData大量新数据:我们从setData底层可知,每次setData都会生成一个脚本,数据量大会导致脚本的编…

微信小程序中,向后台请求数据是,通常想给用户提示正在加载中,如下图: 我们可以用wx.showLoading(OBJECT),当请求服务器的地方多了,怎么才能不每次都要去调用函数,我们只要对wx.request加工下就可以了,在utils下新建js文件network.js var requestHandler = { url: '', data: {}, method: '', success: function (res) { }, fail: function () { }, complet…

Page({ /** * 页面的初始数据 */ data: { }, /** * 生命周期函数--监听页面加载 */ onLoad: function(options) { let _page = this; let config = { api: 'www.playsort.cn' } let configApi = config.api; /** * 为何我们的设置到页面上有的需要加分号? 因为会报错 * 1.怎么解决? 加分号设置到页面上 * 2.怎么解决? 用一个变量保存值,再设置到页面…