小程序学习day08-导航传参、下拉刷新(移动端的专有名词)、上拉触底(移动端的专有名词)、自定义编译模式、生命周期

34、导航传参

(1)声明式导航传参

1)Navigator组件的url属性用来指定将要跳转到页面的路径,同时,可以携带参数
2)携带参数的要求
①参数与路径之间用?分隔
②参数键与参数值之间用=相连
③不同参数用&分隔

(2)编程式导航传参

1)通过wx.navigateTo(Object object)方法跳转页面时,也可以携带参数

(3)在onLoad中接收导航参数

1)通过声明式导航或编程式导航所携带的参数,可以直接在onLoad时间中直接获取

35、下拉刷新(移动端的专有名词)

(1)概念:通过手机在屏幕上的下滑动操作,重新加载页面数据的行为

(2)下拉刷新的方式

1)全局开启
在app.json的window中,将enablePullDownRefresh设置为true
2)局部开启(推荐这个)
在页面json文件中,将enablePullDownRefresh设置为true

(3)配置下拉刷新窗口的样式

1)backgroundColor:用来配置下拉刷新窗口的背景颜色,仅支持16进制
2)backgroundTextStyle:用来配置下拉刷新Loading样式,仅支持dark/light

(4)监听页面的下拉刷新事件

1)在页面的.js文件中,通过onPullDownRefresh()函数进行监听

(5)停止下拉刷新效果(真机测试,会用到)

当处理完下拉刷新后,下拉刷新的loading效果会一直显示,不会主动消失,所以需要手动隐藏loading效果。此时,通过调用wx.stopPullDownRefresh()可以停止当前页面的下拉刷新

36、上拉触底(移动端的专有名词)

(1)概念:通过手指在屏幕上的上拉动作,从而加载更多数据的行为

(2)监听页面的上拉触底事件:在页面的js文件中,通过onReachBottom()函数即可监听当前页面的上拉触底事件。

(3)配置上拉触底距离

可以在全局或页面的json文件的onReachBottomDistance中配置,默认50px

37、自定义编译模式

(1)作用:每次刷新后,跳转到指定页面,而非首页,提高编译效率

(2)步骤:

(以该页面为例)

1)添加
2)删除

38、生命周期

(1)概念:指一个对象从创建、运行到销毁的整个阶段,强调的是一个时间段。

比如:小程序的启动,表示生命周期的开始;小程序的关闭表示生命周期的结束;中间小程序的运行过程,表示小程序的生命周期

(2)分类

1)应用生命周期(特指小程序从启动到运行再到销毁的过程)
2)页面生命周期(特指在小程序中,每个页面的加载到渲染再到销毁的过程)

注:页面生命周期的范围较小,应用生命周期的范围较大

(3)生命周期函数

1)概念:是由小程序框架提供的内置函数,会伴随着生命周期,自动按次序执行
2)作用:允许程序员在特定的时间点,执行某些特定的操作。比如,在onload函数发送请求
3)注:生命周期强调的是时间段,生命周期函数强调的是时间点
4)分类:
①应用的生命周期函数(特指特指小程序从启动到运行再到销毁依次调用的那些函数)(在app.js中声明)
②页面的生命周期函数(特指在小程序中,每个页面的加载到渲染再到销毁依次调用的那些函数)
相关推荐
郝YH是人间理想2 小时前
系统架构设计师案例分析题——web篇
前端·软件工程
Evaporator Core2 小时前
深入探索:Core Web Vitals 进阶优化与新兴指标
前端·windows
向上的车轮2 小时前
MATLAB学习笔记(七):MATLAB建模城市的雨季防洪排污的问题
笔记·学习·matlab
初遇你时动了情2 小时前
html js 原生实现web组件、web公共组件、template模版插槽
前端·javascript·html
mon_star°2 小时前
微信答题小程序支持latex公式显示解决方案
微信·小程序
QQ2740287563 小时前
Soundness Gitpod 部署教程
linux·运维·服务器·前端·chrome·web3
前端小崔3 小时前
从零开始学习three.js(18):一文详解three.js中的着色器Shader
前端·javascript·学习·3d·webgl·数据可视化·着色器
哎呦你好3 小时前
HTML 表格与div深度解析区别及常见误区
前端·html
运维@小兵3 小时前
vue配置子路由,实现点击左侧菜单,内容区域显示不同的内容
前端·javascript·vue.js
龙湾开发4 小时前
计算机图形学编程(使用OpenGL和C++)(第2版)学习笔记 10.增强表面细节(二)法线贴图
c++·笔记·学习·图形渲染·贴图