1. URL 参数传递
通过页面跳转时在 URL 中附加参数,目标页面通过 `onLoad` 方法获取。
// 页面跳转并传递参数 wx.navigateTo({ url: '/pages/targetPage/targetPage?param1=value1¶m2=value2' }); // 目标页面获取参数 Page({ onLoad: function(options) { console.log(options.param1); // 输出: value1 console.log(options.param2); // 输出: value2 } });
2. 全局变量
使用 `getApp()` 获取全局对象,存储和访问数据。
// app.js 中定义全局变量 App({ globalData: { userInfo: null } }); // 页面中设置全局变量 const app = getApp(); app.globalData.userInfo = { name: 'John' }; // 其他页面获取全局变量 const app = getApp(); console.log(app.globalData.userInfo); // 输出: { name: 'John' }
3. 本地存储
使用 `wx.setStorageSync` 和 `wx.getStorageSync` 进行数据存储和读取。
// 存储数据 wx.setStorageSync('key', 'value'); // 获取数据 const value = wx.getStorageSync('key'); console.log(value); // 输出: value
4. 事件传递
通过 `triggerEvent` 在组件间传递数据。
// 子组件触发事件并传递数据 this.triggerEvent('myevent', { data: 'some data' }); // 父组件监听事件 <my-component bindmyevent="onMyEvent"></my-component> Page({ onMyEvent: function(e) { console.log(e.detail.data); // 输出: some data } });
5. 页面栈传递
通过 `getCurrentPages` 获取页面栈,直接访问或修改页面数据。
// 获取页面栈 const pages = getCurrentPages(); const prevPage = pages[pages.length - 2]; // 修改前一页数据 prevPage.setData({ someData: 'new value' });
总结
URL 参数传递:适合简单数据,页面跳转时使用。
全局变量:适合跨页面共享数据。
本地存储:适合持久化数据。
事件传递:适合组件间通信。
页面栈传递:适合页面间直接数据交互。