在小程序中，页面传值和生命周期是开发过程中的重要概念。下面我们来详细研究一下这两个主题。

页面传值

小程序页面之间的传值主要通过几种方式进行：

1. URL 参数传递：

   • 最常见的方式，通过在 navigateTo 或 redirectTo 方法中指定路径参数。
   • 例如：wx.navigateTo({url: '/pages/detail/detail?id=123'})
   • 在目标页面的 onLoad 方法中可以通过 options 参数获取这些通过 URL 传递的参数。

2. 全局变量传递：

   • 可以使用 App 实例或者存储在globalData 中的全局变量来共享数据。
   • 例如，在 app.js 中设置 App({ globalData: { userInfo: null } })，然后在需要的页面中访问 getApp().globalData.userInfo。

3. 使用 wx.setStorageSync 和 wx.getStorageSync：

   • 将数据缓存在本地存储中，从而在各个页面中访问。适合不太频繁改变的数据。
   • 存储：wx.setStorageSync('key', value)
   • 读取：const value = wx.getStorageSync('key')

4. 事件总线：

   • 实现事件监听和触发，主要用于复杂场景下的数据通信。
   • 小程序不自带事件总线功能，可以借助第三方库或自行实现。

生命周期

小程序页面的生命周期包括几个重要的阶段：

1. onLoad(options)：

   • 在页面加载时触发。常用于初始化页面数据。通过 options 获取页面跳转带来的参数。

2. onShow()：

   • 在页面显示时触发。页面每次显示都会调用这个方法。适合需要更新界面数据的场景。

3. onReady()：

   • 页面初次渲染完成时触发。只会执行一次。通常在这里进行界面元素的交互处理。

4. onHide()：

   • 当页面被隐藏时触发，比如 navigateTo 到另一个页面，或打开新的 tab 时。

5. onUnload()：

   • 在页面销毁时触发。用户关闭页面或使用 navigateBack 回退时调用。适用于清理或者释放资源的处理。

6. onPullDownRefresh()：

   • 监听用户下拉页面刷新动作。可以在这里重置页面数据。需在 json 配置文件中开启下拉刷新功能。

7. onReachBottom()：

   • 监听用户上拉触底事件，通常用于分页加载数据。

8. onShareAppMessage()：

   • 用户点击页面右上角分享时触发，可以自定义分享内容。

实践技巧

• 善用生命周期：了解每个生命周期钩子函数的触发时机，合理初始化数据，保持页面性能和响应速度。
• 使用缓存优化：对于需要在多个页面之间传递的大量数据，地方存储（如 wx.setStorageSync）是一个不错的选择。
• 事件处理：复杂项目中可能需要引入事件总线来处理页面间复杂的事件传递和状态管理。

总结来说，理解页面传值和生命周期机制对小程序开发至关重要，有助于编写功能丰富且响应迅捷的应用程序。