1.prop方式

适用于父子组件传值

注意：如果父组件给子组件传递的是函数，则是子向父传值

 <template>
   <div class="parent">
     <son :famsg="getmsg"></son> //子组件绑定famsg变量
   </div>
 </template>
 <script>
 import son from './son' //引入子组件
 export default {
   name: 'parent',
   components:{son},     //使用子组件
   methods:{
    getmsg(sonMsg){
      console.log('子组件中传回的参数',sonMsg);
    }
   },
 }
 </script>

<template>
   <div class="son">
      <button @click="sendmsg">sendmsg</button>
   </div>
 </template>
 <script>
 export default {
   name: 'son',
   props:[ 'famsg' ],
   data () {
     return {
       sonMsg: '我是子组件要传的参数',
     }
   },
   methods: {
      sendmsg(){
        return this.famsg(this.sonMsg) //返回父组件的方法并携带子组件的参数
      }
   },
 }
 </script>

注意：如果父组件给子组件传递的是非函数，则是父向子传值

路由props传值的3种方式：1.布尔值 2. 对象 3.函数

2.自定义事件（on)

适用于子组件(on（'传递函数名‘，回调函数func（e）{this.XXX=e}））

3.全局事件总线（this.$bus)

适用全局this.XXX=e

Vue.prototype.$bus = this

4.pubsub.js (发布与订阅，一般用在react)

适用全局

5.vueX

适用全局

6.插槽

适用结构

默认插槽

具名插槽

作用域插槽