MPVue传值

最近上手mpvue开发微信小程序，发现mpvue官网没有提供页面反向传值的解决方案，于是广查资料，知道eventbus解决方案，再结合之前的iOS通知，写了一个文件来实现pages间的反向传值。
1、新建一个notification.js文件

// 用来存放监听事件
let _notifications = []

/* 添加监听事件
* notificationName  事件传递名称
* selector          事件回调函数
* observe           事件监听者
* */
function addNotification (notificationName, selector, observe) {
  console.log('addNotification=', notificationName, 'selector=', selector, 'observe=', observe)
  if (!notificationName || !selector || !observe) {
    console.log('addNotification error')
    return
  }

  let alreadyNotifi = false
  try {
    _notifications.forEach(item => {
      if (item.name === notificationName && item.selector === selector && item.observe === observe) {
        alreadyNotifi = true
        throw new Error('该实例或组件已添加该通知')
      }
    })
  } catch (e) {
    if (e.message !== '该实例或组件已添加该通知') {
      throw e
    }
  }

  if (alreadyNotifi) {
    console.log('该实例或组件已添加该通知')
    return
  }

  let notification = {
    name: notificationName,
    selector: selector,
    observe: observe
  }

  _notifications.push(notification)
}

/* 发送通知
* notificationName 事件名称
* payload          事件回调函数所需参数
* */
function postNotification (notificationName, payload) {
  console.log('postNotification=' + notificationName, 'payload=', payload)
  if (!notificationName) {
    console.log('postNotification error')
    return
  }

  _notifications.forEach(item => {
    if (item.name === notificationName) {
      item.selector(payload)
    }
  })
}

/* 移除监听
* notificationName 事件名称
* observe          监听者
* */
function removeNotification (notificationName, observe) {
  console.log('removeNotification=' + notificationName, 'observe=', observe)
  if (!notificationName || !observe) {
    console.log('removeNotification error')
    return
  }

  _notifications.forEach((item, index) => {
    if (item.name === notificationName && item.observe === observe) {
      _notifications.splice(index, 1)
    }
  })
}

export default {
  addNotification,
  postNotification,
  removeNotification
}

2、在需要添加监听的地方

// 2.1
  import notificationCenter from '../../utils/notification'
//2.2
  notificationCenter.addNotification('fromdetail', this.fromdetail, this)

3、在发起通知的地方

//3.1
  import notificationCenter from '../../utils/notification'
//3.2
 onLoad () {
   notificationCenter.addNotification('fromindex', this.fromindex, this)
 },
 onUnload () {
   notificationCenter.removeNotification('fromindex', this)
 },

MPVue传值

推荐阅读更多精彩内容