Vue3的组件通信方式。

在一些较深层级的组件通信中，如果使用props通信需要多级传递，而provide和 inject则可以一步到位。比如这里的祖辈组件结孙子组件传递数据，可以优先考虑provide/inject通信。先引入provide，provide需要携带两个参数，一个是给后代组件的key，一个是传递的值。

由于provide传递的值是一个对象或返回一个对象的函数，把这里的value去掉，后代组件使用inject即可接收到祖辈组件传递的数据。同样需要先引入 inject，inject里的字符对应provide的第一个参数。现在这里的深层级组件就实现了通信，那它是否能对数据保持响应式？在祖辈组件里利用input来改变传递的值。看一下后代组件接收数据的变化，可以看到是可以实现同时变化的。

不仅如此，在后代组件中也能修改祖辈组件传递过来的值，因为此时它们所指向的是同一个对象。如果你不希望后代组件修改祖组件传递过来的数据，可以在provide中加上readonly，表示它是一个只读数据。在多个参数的情况下不想使用多个provide，使用数组来传参就能实现替换。

drovide其实还可以实现事件传递，利用事件传递实现后代组件修改祖组件的数据。border nict接收的则是一个数组，想要全局定义也是支持的。在main.js或APP.vue文件中都可以定义。

本期内容就到这，记得三连，下期再见。