vue provide inject跨层级组件传值

适用

        组件层级嵌套较深时，给后代组件传值

用法

        vue3写法

        传值

import { provide } from 'vue'
// 写在与生命周期函数同级处即可
provide('msg', '假如我是一个数据')

        接收

import { inject } from 'vue'
// 声明一个变量去接收
const msg = inject('msg')

        vue2写法

        传值

export default {
    provide() {
        // 这里是共享出去的数据
        return {
            text: "假如我是一个数据",
            obj: {
                id: 1,
                val: 100
            }
        }
    }
}

        接收

export default {
    // 接收数据，想要拿到什么数据，在此处写相对应的名称即可
    inject: ['text', 'obj']
}