下载本文档
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
【移动应用开发技术】微信小程序加载更多和点击查看更多的实现方法
这篇文章给大家分享的是有关微信小程序加载更多和点击查看更多的实现方法的内容。在下觉得挺实用的,因此分享给大家做个参考,一起跟随在下过来看看吧。具体内容如下微信小程序加载更多,是将之前的数据和点击加载后请求的数据用concat拼接在一起并执行setData,下面是一个简单的栗子:index.wxml代码如下<view
wx:for="{{duanziInfo}}"
wx:for-item="name"
wx:for-index="id">
<view
class="duanzi-view">
<view
class="duanzi-content">
<text
class="dz-content">{{name.content}}</text>
</view>
</view>
</view>
<view
class="button-wrapper">
<button
type="default"
size="default"
loading="{{loading}}"
disabled="{{disabled}}"
bindtap="setLoading">
{{loadText}}
</button>
</view>加载更多按钮绑定setLoadingindex.js文件代码如下Page({
data:
{
loadText:'加载更多',
duanziInfo:[]
},
//初始化请求
onLoad:
function
(res)
{
var
that
=
this
//内容
wx.request({
url:
'/index.php?m=Industry&a=getDuanziInfo',
data:
{token:token},
method:
'GET',
success:
function(res){
console.log(res.data.result)
//打印初始化数据
that.setData({
duanziInfo:res.data.result
})
}
})
},
//加载更多
setLoading:
function(e)
{
var
duanziInfoBefore
=
this.data.duanziInfo
var
that
=
this
wx.showToast({
//期间为了显示效果可以添加一个过度的弹出框提示“加载中”
title:
'加载中',
icon:
'loading',
duration:
200
})
wx.request({
url:
'/index.php?m=Industry&a=getDuanziInfo',
data:
{token:token},
method:
'GET',
success:
function(res){
console.log(duanziInfoBefore.concat(res.data.result))
//打印拼接之后数据
that.setData({
loadText:"数据请求中",
loading:true,
duanziInfo:duanziInfoBefore.concat(res.data.result),
loadText:"加载更多",
loading:false,
})
}
})
}
})初始化和加载更多中的打印数据如下(以上是点击查看更多,还可以根据距离视图区域的距离来加载更多,具体实现是将视图用<scroll-view>标签,并给其一个固定高度,在给定参数中设置距离像素触发事件。具体文档:/debug/wxadoc/dev/component/scroll-view.html?t=20161122)感谢各位的阅读!关于“
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 【正版授权】 ISO 21257:2024 EN Plastics - Polymer polyols for use in the production of polyurethanes - Determination of the residual acrylonitrile and styrene monomer content by gas chro
- 五年级作文的教学计划3篇
- 水利工程建设单位安全技术措施编制审查制度
- 2024年显示玻璃行业政策分析:显示玻璃行业标准确保产品符合质量标准
- 2024年3D打印材料市场分析:3D打印材料全球总产值达到32.60亿美元
- cfo的职责和工作内容
- 300字自我陈述模板
- 2024-2025学年中职中职专业课医学技术类72 医药卫生大类教学设计合集
- 2024-2025学年高中化学选修3 物质结构与性质人教版教学设计合集
- 我的朋友作文1000字
- 化学品物料安全告知书
- 医院非产科孕情管理和三病检测工作方案
- 基于stm32的低频数字相位测量仪
- 保卫黄河 殷承宗 独奏钢琴谱 完美完整版13页
- 二年级上英语单词(北京版)
- 五年级美术上册展现瞬间之美课件北京版
- 蜗杆与蜗轮主要参数计算
- 冰雪奇缘图文梗概英文版
- (完整版)《金属与石材幕墙工程技术规范》JGJ1332001最新(精华版)
- 浅谈如何培养少先队员的责任心
- 安装调试记录表.doc
评论
0/150
提交评论