0. vue数据传送介绍

a. 想在一个组件里面，引用另一个组件的数据

b. 可以用vuex或者本文写的三方法

c. 规律：父拿的都是key，子拿的是数据/函数(回调)

1. 若想让自定义事件只能触发一次，可以使用once修饰符，或$once方法。

2. 触发自定义事件：this.$emit('atguigu',数据)

3. 解绑自定义事件this.$off('atguigu')

4. 组件上也可以绑定原生DOM事件，需要使用native修饰符。

5. 注意：通过this.$refs.xxx.$on('atguigu',回调)绑定自定义事件时，回调要么配置在methods中，要么用箭头函数，否则this指向会出问题！

一. 父传子

1. 在需要使用父组件值的标签处，添加一个自定义属性

<!--    1-->
<Header :father_son="cart_length"></Header>

2. 在父组件中赋值

cart_length: 12,

 3. 在子组件中写一个props

// 父传子
props: ['father_son',],

4. 在子组件中使用

<b>{{ father_son }}</b>

二. 子传父

1. 在需要使用父组件值的标签处，添加一个自定义事件

<CartItem v-for="(cart_val,cart_index) in courseData" :key="cart_val.id" 
                    @father_del="father_val(cart_index)"></CartItem>

2. 父组件写一个函数，进行逻辑处理

 // 2 自动执行 子-父  都是父亲拿值，儿子拿key
    father_val(val) {
      // val 当前传的值
      
    },

3. 子组件传值

   this.$emit('father_del') // 3. 也可以传参 ，this.$emit('father_del',1)

三. 兄弟相传(需要借助一个公交车)

例子：A放值，B取值

首先都需要一个公交车

let bus = new Vue();

1. A 放值

bus.$emit('TestData','dbj')

2. B取值

bus.$on('TestData',(val)=>{
                console.log(val);
            })