vue

vue组件之间的传值

provide/ inject

父组件中通过provide来提供变量, 然后再子组件中通过inject来注入变量。 注意: 这里不论子组件嵌套有多深, 只要调用了inject 那么就可以注入provide中的数据，而不局限于只能从当前父组件的props属性中回去数据 假设A为父组件B和C均为A的子组件，D为B的子组件，则在A组件中使用provide定义变量，在B、C、D组件中均可通过inject拿到传过来的值。（provide中定义的变量不可在父组件中 使用）

注：provide 和 inject 主要为高阶插件/组件库提供用例。并不推荐直接用于应用程序代码中。（官方文档描述）

父组件

export default {
    data () {
        return {}
    },
    provide: {
        index: '来自index的数据'
    }
}

子组件

export default {
    data () {
        return {}
    },
    inject: ['index']  // 直接可以在页面使用index或在js中进行赋值
}