微信小程序:页面全局参数(注意不是小程序的全局变量globalData)
为什么要使用页面全局参数:方便使用数据。
由于总页数需要再另外的一个方法中使用,所以要把总页数变成一个页面全局参数。因为取数据使用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)的更多相关文章
- 微信小程序页面带参数跳转
页面传递参数的方式 data-para js获取参数
- 微信小程序页面带参数跳转及接收参数内容navigator
功能从index页面跳转到draw页面,并在draw页面获取id及imgUrl index.wxml <navigator class='looks-view' wx:for="{{i ...
- 小程序页面收录 sitemap
微信现已开放小程序内搜索,你的小程序页面将可能展示在微信搜索等多个公开场景中.当开发者允许微信索引时,微信会通过爬虫的形式,为小程序的页面内容建立索引. 若小程序中存在不适合展示信息如用户个人信息.商 ...
- 微信小程序跳转页面时参数过长导致参数丢失
问题描述: 微信小程序:跳转页面时传参,参数过长导致参数丢失 跳转到文章详情页时,使用的文章链接e.currentTarget.dataset.id过长导致参数丢失 handleClickArticl ...
- 微信小程序 (全局配置和页面配置)
全局配置 app.json 文件用来对微信小程序进行全局配置. 一.配置页面路径 二.window 配置全局默认的窗口 navigationBarTextStyle:导航栏的标题颜色 navigati ...
- Java 获取微信小程序二维码(可以指定小程序页面 与 动态参数)
一.准备工作 微信公众平台接口调试工具 小程序的唯一标识(appid) 小程序的密钥(secret) 二.获取access_token 打开微信公众平台接口调试工具,在参数列表中输入小程序的appid ...
- 微信小程序页面跳转方法和携带参数详解
1.页面跳转方式 (1)标签跳转 open-type的属性值对应api里的用法即wx.的用法 1 <navigator url="/page/navigate/navi ...
- 在微信小程序页面间传递数据总结
在微信小程序页面间传递数据 原文链接:https://www.jianshu.com/p/dae1bac5fc75 在开发微信小程序过程之中,遇到这么一些需要在微信小程序页面之间进行数据的传递的情况, ...
- 微信小程序页面跳转的三种方式总结
原文链接 https://blog.csdn.net/zgmu/article/details/72123329 首先我们了解到,小程序规定页面路径只能有五层,所以我们尽量避免多层级的页面跳转 页面跳 ...
随机推荐
- Linux常用习惯和技巧
1.如果有些命令在执行时不断地在屏幕上输出信息,影响到后续命令的输入,则可以在执行命令时在末尾添加上一个&符号,这样命令将进入系统后台来执行.
- dedecms新建内容模型以及如何添加字段
dedecms新建内容模型以及如何添加字段 内容模型就是我们所说的频道模型,利用频道模型可以实现其使用他的栏目具备一些功能,比如说,图片模型,在使用他的栏目中就可以发表多个图片,并且能够达到相册的功能 ...
- DEDECMS:删除DEDE自带的织梦链方法
在include/taglib/flinktype.lib.php里删除掉如下代码: $dedecms = false; $dedecms->id = 999; $dedecms->typ ...
- jquery each报 Uncaught TypeError: Cannot use 'in' operator to search for错误
用$.each()来遍历后台传过来的json数据.直接遍历传过来的数据时就发生 Uncaught TypeError: Cannot use 'in' operator to search for 这 ...
- Linux上搭建https服务器
https原理: 步骤:1.客户端浏览器向服务器发送如下信息:(1)客户端支持的SSL/TLS协议的版本号(2)密钥算法套件(3)客户端产生的随机数,用于稍后生成"会话密钥"2.服 ...
- 【C#】对两张图片进行矩阵运算会怎么样?
对两张图片进行矩阵运算会怎么样? 在学习<线性代数>的矩阵运算时,突然想到图片也可以算是一种矩阵,那么对图片进行矩阵的运算会出现什么样的效果呢?为了满足好奇,便用C#写了个对图片进行矩阵运 ...
- C - Oulipo
The French author Georges Perec (1936–1982) once wrote a book, La disparition, without the letter 'e ...
- [NC13331]城市网络
传送门 题意: 思路: 对于每组查询,我们直接从$u$往上搜到$v$,复杂度$O(nq)$,显然不可取(不过这题开始的数据很弱,暴力就过了) #include<bits/stdc++.h> ...
- 2020牛客暑期多校训练营(第四场)BCFH
BCFH B. Basic God Problem 题意 给出c和n,求fc(n). 题解 递归到最后 fc 函数肯定等于1,那么就变成了求c被乘了几次,只要找到 x 最多能被分解成多少个数相乘就好了 ...
- 迪杰斯特拉+拆点 Deliver the Cake - HDU 6805
题意: t组输入,给你n个点m条边.你需要输出从s点到t点的最短距离,然后是m条边,每条边输入信息为: a,b,c 表示从a点到b点的一个无向边长度为c 每一个点会有一个属性L.R或M 如果a和b一个 ...