uniapp 页面通信uni.$emit、eventChannel

ゝ一纸荒年。 2021-07-24 15:12 2194阅读 0赞

发送
    	uni.$emit('update',{msg:'页面更新'})
    
    监听
        uni.$on('update',function(data){
            console.log('监听到事件来自 update ，携带参数 msg 为：' + data.msg);
        })
    
    监听一次
        uni.$once('update',function(data){
            console.log('监听到事件来自 update ，携带参数 msg 为：' + data.msg);
        })
        
    注销监听
        uni.$off([eventName, callback])
    	    	
    	    如果没有提供参数，则移除所有的事件监听器；
    	    如果只提供了事件，则移除该事件所有的监听器；
    	    如果同时提供了事件与回调，则只移除这个回调的监听器；
    	    提供的回调必须跟$on的回调为同一个才能移除这个回调的监听器；

uni.navigateTo({ 
      url: 'pages/test?id=1',
      events: { 
        // 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
        acceptDataFromOpenedPage: function(data) { 
          console.log(data)
        },
        someEvent: function(data) { 
          console.log(data)
        }
        ...
      },
      success: function(res) { 
        // 通过eventChannel向被打开页面传送数据
        res.eventChannel.emit('acceptDataFromOpenerPage', {  data: 'test' })
      }
    })
    
    // uni.navigateTo 目标页面 pages/test.vue
    onLoad: function(option) { 
      console.log(option.query)
      const eventChannel = this.getOpenerEventChannel()
      eventChannel.emit('acceptDataFromOpenedPage', { data: 'test'});
      eventChannel.emit('someEvent', { data: 'test'});
      // 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
      eventChannel.on('acceptDataFromOpenerPage', function(data) { 
        console.log(data)
      })
    }