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

由于总页数需要再另外的一个方法中使用,所以要把总页数变成一个页面全局参数。因为取数据使用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. linux 高可用----keepalived+lvs

    什么是高可用? HA(high availability)即高可用性:就是在高可用集群中发生单点故障时,能够自动转移资源并切换服务,以保证服务一直在线的机制. LVS LVS:(linux virtu ...

  2. oss-server 小型对象存储系统

    oss-server 项目介绍 oss-server是针对项目开发时提供的小型对象存储系统,开发者在针对文件上传时业务剥离,同时方便文件迁移,为满足单个项目,多个系统的情况下,提供统一的oss服务 o ...

  3. burpsuite是用教程

    1.下载burp suite工具 首先要明确,需要java环境,并且配置java环境变量 可以通过吾爱破解下载工具 工具: 双击打开后直接点next --> start burpsuite: 3 ...

  4. 如何获得svn的版本号信息?

    方法一  popen(可获取命令行执行后的输出结果) 转载自: C++执行命令行指令并获取命令行执行后的输出结果 1 /* 2 Execute command line commands and ge ...

  5. Python爬虫入门教程:豆瓣Top电影爬取

        基本开发环境 Python 3.6 Pycharm 相关模块的使用 requests parsel csv 安装Python并添加到环境变量,pip安装需要的相关模块即可. 爬虫基本思路 一. ...

  6. [The Preliminary Contest for ICPC Asia Shanghai 2019] B-Light bulbs(差分+思维)

    前言 最近有很多算不上事的事,搞得有点心烦,补题难免就很水,没怎么搞,自我检讨一番~~ 说实话网络赛题目的质量还是挺高的,题目都设计的挺好的,很值得学习.这场比赛那会只有我们大二的在做,其他人去参加$ ...

  7. Codeforces Round #655 (Div. 2) B. Omkar and Last Class of Math

    题目链接:https://codeforces.com/contest/1372/problem/B 题意 给出一个正整数 $n$,找到两个正整数 $a,b$ 满足 $a+b = n$ 且 $LCM( ...

  8. POJ - 3376 Finding Palindromes(拓展kmp+trie)

    传送门:POJ - 3376 题意:给你n个字符串,两两结合,问有多少个是回文的: 题解:这个题真的恶心,我直接经历了5种错误类型 : ) ... 因为卡内存,所以又把字典树改成了指针版本的. 字符串 ...

  9. 2.Url重定向和重写

    虚拟地址===>真实地址映射(搜索引擎优化,抽象能力,防盗链) 之前:IIS重写模块规则,Apache mod_Rewrite.Nginx上的URL重写. 现在:通过中间件来实现. 重定向与重写 ...

  10. OpenStack Train版-9.安装neutron网络服务(计算节点)

    在计算节点安装neutron网络服务(computel01计算节点192.168.0.20)安装组件 yum install openstack-neutron-linuxbridge ebtable ...