为什么要使用页面全局参数:方便使用数据。

由于总页数需要再另外的一个方法中使用,所以要把总页数变成一个页面全局参数。因为取数据使用this.xxx即可,中间不用加data,给页面全局参数赋值页方便,直接使用this.xxx=值即可,不需要使用setData()

页面全局参数与data同层级。

Page({

  /**
* 页面的初始数据
*/
data: {
goodsList: [],
total: 0
},
//接口要的参数
QueryParams: {
query: '',
cid: '',
pagenum: 1,
pagesize: 10
},
// 总页数
totalPages: 1,
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
//console.log(options)
this.QueryParams.cid = options.cid || ''
this.QueryParams.query = options.query || ''
this.getGoodsList();
},
async getGoodsList(){
//console.log(this.QueryParams)
const res = await request({url: "/goods/search",data: this.QueryParams})
console.log(res)
//获取总条数
const total = res.total
//计算总页数
this.totalPages = Math.ceil(total / this.QueryParams.pagesize)
console.log(this.totalPages)
this.setData({
//拼接了数组
goodsList: [...this.data.goodsList,...res.goods]
})
wx.stopPullDownRefresh();
}, /**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
this.setData({
goodsList: []
})
this.QueryParams.pagenum = 1;
this.getGoodsList();
}, /**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
// console.log("页面触底")
//判断还有没有下一页
if(this.totalPages > this.QueryParams.pagenum){
//console.log("还有下一页")
this.QueryParams.pagenum++;
this.getGoodsList();
}else{
//console.log("没有下一页了")
wx.showToast({
title: '没有下一页数据了!'
});
}
}, })

注意:获取data数据模型中的值是通过this.data.xx来获取的。注意:微信小程序中获取数据模型中的值和给数据模型中的属性赋值都与vue中的不一样。

把输入框的值赋值给data当中使用setData方法

微信小程序:页面全局参数(注意不是小程序的全局变量globalData)的更多相关文章

  1. 微信小程序页面带参数跳转

    页面传递参数的方式 data-para js获取参数

  2. 微信小程序页面带参数跳转及接收参数内容navigator

    功能从index页面跳转到draw页面,并在draw页面获取id及imgUrl index.wxml <navigator class='looks-view' wx:for="{{i ...

  3. 小程序页面收录 sitemap

    微信现已开放小程序内搜索,你的小程序页面将可能展示在微信搜索等多个公开场景中.当开发者允许微信索引时,微信会通过爬虫的形式,为小程序的页面内容建立索引. 若小程序中存在不适合展示信息如用户个人信息.商 ...

  4. 微信小程序跳转页面时参数过长导致参数丢失

    问题描述: 微信小程序:跳转页面时传参,参数过长导致参数丢失 跳转到文章详情页时,使用的文章链接e.currentTarget.dataset.id过长导致参数丢失 handleClickArticl ...

  5. 微信小程序 (全局配置和页面配置)

    全局配置 app.json 文件用来对微信小程序进行全局配置. 一.配置页面路径 二.window 配置全局默认的窗口 navigationBarTextStyle:导航栏的标题颜色 navigati ...

  6. Java 获取微信小程序二维码(可以指定小程序页面 与 动态参数)

    一.准备工作 微信公众平台接口调试工具 小程序的唯一标识(appid) 小程序的密钥(secret) 二.获取access_token 打开微信公众平台接口调试工具,在参数列表中输入小程序的appid ...

  7. 微信小程序页面跳转方法和携带参数详解

    1.页面跳转方式     (1)标签跳转   open-type的属性值对应api里的用法即wx.的用法   1 <navigator url="/page/navigate/navi ...

  8. 在微信小程序页面间传递数据总结

    在微信小程序页面间传递数据 原文链接:https://www.jianshu.com/p/dae1bac5fc75 在开发微信小程序过程之中,遇到这么一些需要在微信小程序页面之间进行数据的传递的情况, ...

  9. 微信小程序页面跳转的三种方式总结

    原文链接 https://blog.csdn.net/zgmu/article/details/72123329 首先我们了解到,小程序规定页面路径只能有五层,所以我们尽量避免多层级的页面跳转 页面跳 ...

随机推荐

  1. 深复制VS浅复制(MemberwiseClone方法介绍)

    MemberwiseClone方法,属于命名空间System,存在于程序集 mscorlib.dll中.返回值是System.Object.其含义是:创建一个当前object对象的浅表副本. MSDN ...

  2. 一个简单且易上手的 Spring boot 后台管理框架-->EL-ADMIN

    一个简单且易上手的 Spring boot 后台管理框架 后台源码 前台源码

  3. cloudera manager server迁移

    一.迁移背景 服务器出了问题,导致整个cm server界面呈现出不可用的状态,也就是获取不到各个大数据组件以及主机相关的状态的信息,整个cm server的前端界面处于瘫痪的状态,不可用,刚开始怀疑 ...

  4. Notepad++ 替换 CRLF 为 LF

    对于文件中每一行的结尾符号,Windows 下默认为 CRLF,而 Unix 下默认为 LF. 所以经常会有这样的情况发生:在 Windows 系统下编辑的文件放在 Unix 下不能正常执行,比如 b ...

  5. 在eclipse完成对Java_web项目里面资源文件的读取

    Java_web项目的资源文件一般有两种: 一种是存放数据之间有联系的文件,使用xml文件 另一种是存放数据之间没有联系的文件,使用properties文件 这里我们对properties文件读写做示 ...

  6. UVA1401 Remember the Word 字典树维护dp

    题目链接:https://vjudge.net/problem/UVA-1401 题目: Neal is very curious about combinatorial problems, and ...

  7. AtCoder Beginner Contest 182 D - Wandering (前缀和)

    题意:在\(x\)轴上,你刚开始在\(0\)的位置,第\(i\)次操作需要走\(A_1,...,A_i\)个单位,如果\(A_i\)为正向右走,否则向左走,求你所能走到的最大坐标. 题解:我们一步一步 ...

  8. 二进制安装kubernetes(四) kube-scheduler组件安装

    介绍资料转载地址:https://www.jianshu.com/p/c4c60ccda8d0 kube-scheduler在集群中的作用 kube-scheduler是以插件形式存在的组件,正因为以 ...

  9. Linux系统启动过程内核文件丢失解决方法

    一.问题描述 公司近期因机房断电,导致服务器重启后,引导进入不了操作系统.经过检查发现启动文件缺失,导致系统启动失败,网上搜了好多资料,解决都比较零散,现结合实际处理经验和网友的建议整理接方案. 二. ...

  10. Java RMI 实现一个简单的GFS(谷歌文件系统)——背景与设计篇

    目录 背景 系统设计 1. 系统功能 2. Master组件 2.1 命名空间 2.2 心跳机制 2.3 故障恢复和容错机制 3. ChunkServer组件 3.1 本地存储 3.2 内存命中机制 ...