vue组件之间传值

• 父子组件之间传值：props、$emit
• 祖孙组件之间传值：provide和inject
• 兄弟（无关联）组件之间传值：\(emit和\)on（Event bus）、vuex、sessionStorage、localStorage

  • vue的\(emit和\)on，这是vue实现的Vue Event Bus插件的 on 和 emit方法。EventBus是消息传递的一种方式，基于一个消息中心，订阅和发布消息的模式，称为发布订阅者模式。使用this.\(on定义一个事件，this.\)emit触发这个事件。如下：

    <div id='app'>
    	<button @click='boost' > 触发事件</button>
    </div>
    
    data() {
    	return {
    		message: 'hello vue'
    	}
    },
    created() {
    	this.$on('my_events', this.handleEvents)
    },
    methods: {
    	handleEvents(e) {
    		console.log(this.message, e)
    	},
    	boost() {
    		this.$emit('my_events', 'my params')
    	}
    }