组件间隔代传递--provide inject

应用场景描述：祖父组件提供数据，子孙组件可以依据需求将祖父提供的数据注入自己的组件中。

优势：不用一层层props,无视中间隔了多少层组件。

缺点：祖父组件的提供的数据是调用接口从后台获取的，这种情况下由于存在异步，子组件开始是拿不到值的，需要default设置初始值以免报错。

使用感受：感觉不大友好，最终我还是props一层层传值了。

<script>

    export default {
//祖父组件

        provide(){
            return {
                foo : this.locationFrom,
                goo: 'this is a test'
            }
        }
//孙子组件   

        inject:{
            foo:{
                from:'foo',
                default:0
            },
            goo:{
                from:'goo',
                default:()=>'failed!'
            }
        }

}
</script>