组件与页面之间想通过$ emit，来触发一个事件，传递数据，可是当在目标页面利用$on监听事件，获取数据时，发现第一次并不能监听到事件，而返回再次点击就可以监听到数据。

原因在于$ emit 先于$ on 执行了，Vue并没有储存监听事件，所以无法监听到数据。

因为不想用vuex来解决，所以利用eventBus来解决，而且组件不直接通过$on来存储数据，而是利用bus实例来存储数据，然后组件只负责来获取数据。

首先在utils目录下（bus.js放置位置自己决定），新建bus.js 文件，内容如下：

import Vue from 'vue'
export const bus = new Vue({
  data () {
    return {
      // 定义数据
      data: {}
    }
  },
  created () {
    // 绑定监听
    this.$on('toDetailPage', (value)=>{
      this.data = value.data
    })
  }
})

在发送数据的组件里先引用

import {bus} from "../../utils/bus.js"

在跳转方法中，触发$ emit事件

skip_to_detail: function (e) {
      //跳转到详情页面
        var that = this;
		bus.$emit('toDetailPage', {
	             data: {
	             userName: that.userName,
	             commodityId: that.commodityId,
	             ...
	             ...
	             commodityDescription: that.commodityDescription,
	           },
	           })
  
            uni.navigateTo({
            	url: "../../detailPage",
            })
    }

在目标页面中也是先引用bus.js文件

import {bus} from "../../../utils/bus.js"

通过computed计算属性，来接受数据，动态响应刷新页面

computed:{  
  	userName(){
		return bus.data.userName
	},
  	commodityId(){
		return bus.data.commodityId
	},
  	...
  	...
  	commodityDescription(){
		return bus.data.commodityDescription
	}
  },