微信小程序可以通过以下几种方式来传递数据和实现数据共享:
- 页面跳转时传递数据 通过
wx.navigateTo或wx.redirectTo等页面跳转方法,可以在url后面拼接参数来传递数据。接收方可以通过options对象来获取传递的参数。 代码示例: 在页面A中跳转到页面B并传递参数:
jsCopy code
wx.navigateTo({
url: '/pages/b/b?id=1&name=test'
})
在页面B中获取传递的参数:
jsCopy code
Page({
onLoad: function (options) {
console.log(options.id) // 输出1
console.log(options.name) // 输出test
}
})
- 全局数据共享 通过
getApp()方法获取小程序实例,可以在实例中定义全局变量来实现数据共享。 代码示例: 在小程序实例中定义全局变量:
jsCopy code
App({
globalData: {
userInfo: null
}
})
在页面中获取和修改全局变量:
jsCopy code
const app = getApp()
Page({
onLoad: function () {
console.log(app.globalData.userInfo) // 输出null
app.globalData.userInfo = {name: 'test'}
console.log(app.globalData.userInfo) // 输出{name: 'test'}
}
})
- 发布订阅模式 通过
wx.on和wx.emit等方法,可以实现发布订阅模式,实现组件间的数据共享。 代码示例: 定义事件和数据:
jsCopy code
const event = require('../../utils/event.js')
event.on('test', function (data) {
console.log(data) // 输出{a: 1, b: 2}
})
发布事件:
jsCopy code
const event = require('../../utils/event.js')
event.emit('test', {a: 1, b: 2})
以上是微信小程序中常用的数据传递和数据共享方式,通过合理的使用可以实现不同组件之间的数据传递和共享。