微信小程序开发（四）注册页面 page.js

本文主要是介绍微信小程序开发（四）注册页面 page.js，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

注册小程序时我们在app.json配置文件里通过pages注册过各个页面

每一个页面对应自己的一系列相关文件如index，包括

index.wxml(view层)、index.js(逻辑层contral)、index.wxss(样式文件)、index.json(页面级别配置，可覆盖app.json中的window配置项)，这些文件的关联是在微信小程序的框架中自动结合绑定的，无须人为操作！

创建一个页面

index.js

1.获取小程序的实例

const app = getApp(); //getApp()为全局方法，可以通过该对象调用app注册属性或方法，但是不要调用app的生命周期方法

2.注册页面

page(object) //注册一个页面。接受一个 object 参数，其指定页面的初始数据、生命周期函数、事件处理函数等。

参数介绍

属性	类型	描述
data	Object	页面的初始数据,可以直接在view层绑定数据
onLoad	Function	生命周期函数--监听页面加载,只执行一次，可以获取打开当前页面所调用的 query 参数
onReady	Function	生命周期函数--监听页面初次渲染完成，只执行一次
onShow	Function	生命周期函数--监听页面显示，每次打开页面都会调用一次，页面已妥当，可以和视图层进行交互
onHide	Function	生命周期函数--监听页面隐藏，当navigateTo或底部tab切换时调用
onUnload	Function	生命周期函数--监听页面卸载，当redirectTo或navigateBack的时候调用。
onPullDownRefresh	Function	页面相关事件处理函数--监听用户下拉动作，需要在app.json的window配置中开启
onReachBottom	Function	页面上拉触底事件的处理函数，在触发距离(app.json的window配置)内滑动期间，本事件只会被触发一次。
onShareAppMessage	Function	用户点击右上角转发,只有定义了此事件处理函数，右上角菜单才会显示“转发”按钮,自定义转发内容
onPageScroll	Function	页面滚动触发事件的处理函数,页面在垂直方向已滚动的距离（单位px）
其他	Any	开发者可以添加任意的函数或数据到 object 参数中，在页面的函数中用 this 可以访问

数据流驱动

在页面生命周期内，可根据需要处理相应的数据，更新视图层，需要更新数据，此时需要使用 this.setData()方法

setData() 函数用于将数据从逻辑层发送到视图层（异步），同时改变对应的 this.data 的值（同步）

字段	类型	必填	描述	最低版本
data	Object	是	这次要改变的数据
callback	Function	否	回调函数	1.5.0

注意：

1. 直接修改 this.data 而不调用 this.setData 是无法改变页面的状态的，还会造成数据不一致。
2. 单次设置的数据不能超过1024kB，请尽量避免一次设置过多的数据。
3. 请不要把 data 中任何一项的 value 设为 undefined ，否则这一项将不被设置并可能遗留一些潜在问题。

这篇关于微信小程序开发（四）注册页面 page.js的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---