# 注册页面 对于小程序中的每个页面，都需要在页面对应的 js 文件中进行注册，指定页面的初始数据、生命周期回调、事件处理函数等。 ## 使用 Page 构造器注册页面 简单的页面可以使用 Page() 进行构造。 代码示例： ~~~ //index.js Page({ data: { text: "This is page data." }, onLoad: function(options) { // 页面创建时执行 }, onShow: function() { // 页面出现在前台时执行 }, onReady: function() { // 页面首次渲染完毕时执行 }, onHide: function() { // 页面从前台变为后台时执行 }, onUnload: function() { // 页面销毁时执行 }, onPullDownRefresh: function() { // 触发下拉刷新时执行 }, onReachBottom: function() { // 页面触底时执行 }, onShareAppMessage: function () { // 页面被用户分享时执行 }, onPageScroll: function() { // 页面滚动时执行 }, onResize: function() { // 页面尺寸变化时执行 }, onTabItemTap(item) { // tab 点击时执行 console.log(item.index) console.log(item.pagePath) console.log(item.text) }, // 事件响应函数 viewTap: function() { this.setData({ text: 'Set some data for updating view.' }, function() { // this is setData callback }) }, // 自由数据 customData: { hi: 'MINA' } }) ~~~ 详细的参数含义和使用请参考 [Page 参考文档](https://www.w3cschool.cn/weixinapp/weixinapp-sxd138ql.html) 。 ## 在页面中使用 behaviors > 基础库 2.9.2 开始支持，低版本需做[兼容处理](https://www.w3cschool.cn/weixinapp/compatibility.html?RECACHE=1)。 页面可以引用 behaviors 。 behaviors 可以用来让多个页面有相同的数据字段和方法。 ~~~ // my-behavior.js module.exports = Behavior({ data: { sharedText: 'This is a piece of data shared between pages.' }, methods: { sharedMethod: function() { this.data.sharedText === 'This is a piece of data shared between pages.' } } }) ~~~ ~~~ // page-a.js var myBehavior = require('./my-behavior.js') Page({ behaviors: [myBehavior], onLoad: function() { this.data.sharedText === 'This is a piece of data shared between pages.' } }) ~~~ 具体用法参见 [behaviors](https://www.w3cschool.cn/weixinapp/weixinapp-tghb38sa.html) 。 ## 使用 Component 构造器构造页面 > 基础库 1.6.3 开始支持，低版本需做[兼容处理](https://www.w3cschool.cn/weixinapp/compatibility.html?RECACHE=1)。 Page 构造器适用于简单的页面。但对于复杂的页面， Page 构造器可能并不好用。 此时，可以使用 Component 构造器来构造页面。 Component 构造器的主要区别是：方法需要放在 methods: { } 里面。 代码示例： ~~~ Component({ data: { text: "This is page data." }, methods: { onLoad: function(options) { // 页面创建时执行 }, onPullDownRefresh: function() { // 下拉刷新时执行 }, // 事件响应函数 viewTap: function() { // ... } } }) ~~~ 这种创建方式非常类似于 自定义组件 ，可以像自定义组件一样使用 behaviors 等高级特性。 具体细节请阅读 [Component 构造器](https://www.w3cschool.cn/weixinapp/weixinapp-453938s7.html) 章节。