微信小程序-全局数据共享/页面间通信

一.全局数据共享

声明全局的变量,在app.js文件里

App({

  //全局共享的数据
  globalData:{
    token:''
  },

  //设置全局数据
  setToken(token){
    this.globalData.token=token
  }


})

使用 getApp() 获取全局App实例

//返回全局唯一的APP实例
const appInstance=getApp()

Page({

  login(){
    console.log(appInstance)
    appInstance.setToken('11111')
  }

})

二.页面间通信

上级页面使用回调函数参数eventChannel的emit方法发送数据给下级页面

使用events对象处理下级页面返回的数据

Page({
  //点击按钮触发事件处理函数
  handler(){
    wx.navigateTo({
      url: '/pages/list/list',
      events:{
        //key:被打开页面的发射的事件
        //value:回调函数
        currentEvent:(res)=>{
          console.log(res)
        }
      },
      success(res){
        //通过回调函数获取eventChannel并发射数据
        res.eventChannel.emit('myevent',{
          name:'tom'
        })
      }
    })
  }
})

下级页面使用eventChanel的on方法监听发送的数据,使用emit方法发送数据给上级页面

Page({
  onLoad(){
    //获取eventChannel事件
    const eventChanel = this.getOpenerEventChannel()

    //监听发射的事件
    eventChanel.on('myevent',(res)=>{
      console.log(res)
    })

    //也可以发数据
    eventChanel.emit("currentEvent",{age:10})
  }

})
相关推荐
然后就去远行吧4 小时前
小程序组件 —— 31 事件系统 - 事件绑定和事件对象
前端·javascript·小程序
说私域5 小时前
社群团购项目运营策略的深度剖析:融合链动2+1模式、AI智能名片与S2B2C商城小程序的综合应用
大数据·人工智能·小程序
oil欧哟8 小时前
uniapp 小程序 textarea 层级穿透,聚焦光标位置错误怎么办?
vue.js·小程序·uni-app·uniapp
说私域8 小时前
微商关系维系与服务创新:链动2+1模式、AI智能名片与S2B2C商城小程序的应用研究
人工智能·小程序
说私域11 小时前
信息时代的消费者行为变迁与应对策略:基于链动2+1模式、AI智能名片及S2B2C商城小程序的分析
大数据·人工智能·小程序
毕业设计-0116 小时前
0051.ssm+小程序校园餐厅订餐小程序+论文
后端·小程序·毕业设计·ssm·源代码管理
XDU小迷弟21 小时前
第5天:APP应用&微信小程序&原生态开发&H5+Vue技术&封装打包&反编译抓包点
vue.js·web安全·微信小程序·小程序·架构
院人冲冲冲21 小时前
需求:h5和小程序预览图片需要有当前第几张标识
前端·小程序
紫麦熊1 天前
微信小程序订阅消息提醒-云函数
微信小程序·小程序
V+zmm101341 天前
基于java的餐厅点餐系统微信小程序ssm+论文源码调试讲解
java·数据库·微信小程序·小程序·毕业设计