reject与provide

他的产生是为了多级嵌套子组件引用父组件的值！A中有B,B中有C,A给C数据与方法。
官网的说法

• 其实和props引用差不多，也可以声明默认值和类型 其绑定的不可监听，
• 如果传入可监听的对象，其属性也可监听！！

简单粗暴，看demo
test1.vue ------ 定义方法method和数据msg，

<template>
    <div class="test1">
        <son></son> 
    </div>
</template>
<script>
import son from '../components/Son.vue'
export default {
    name: 'test1',
    provide(){
        return{
            msg: this.helloMsg,
            method: this.somemethod,
        }
    },
    components: {
        son,
    },
    data(){
        return {
            helloMsg: {
                time: '2019-07',
                content: '你好'
            }
        }
    },
    methods: {
        somemethod(){
            this.helloMsg.time = '2019-07-10';
        }
    }
}
</script>

son.vue ------------ 引用数据，在data中赋值

<template>
    <div class="son">
        儿子---{{fromtest}}
        <grandson></grandson>
    </div>
</template>
<script>
import grandson from './Grandson.vue'
export default {
    inject: ['msg'],
    components: {
        grandson,
    },
    name: 'son',
    data(){
        return {
            fromtest: this.msg,
        }
    }
}
</script>

Grandson.vue ------------ 引用数据和运行方法

   <template>
    <div class="grandson">
        孙子--{{fromtest}}
    </div>
</template>
<script>
export default {
    name: 'grandson',
    inject: ['msg','method'],
    data(){
        return {
            fromtest: this.msg,
        }
    },
    mounted(){
        this.method();
    }
}
</script>

结果：

可以看到方法运行了，数据过去了
最后的话
在任意层级都能访问导致数据追踪比较困难，不知道是哪一个层级声明了这个或者不知道哪一层级或若干个层级使用了，因此这个属性通常并不建议使用能用vuex的使用vuex，不能用的多传参几层，但是在做组件库开发时，不对vuex进行依赖，且不知道用户使用环境的情况下可以很好的使用

demo参考简书

你想吃彩虹糖吗？我有长颈鹿，可以挤给你！