父组件可以通过 provide 来提供数据，而子组件可以通过 inject 来注入这些数据。这种方式可以在组件树中任意层次传递数据。
父组件：htmlCopy
<template>
<div>
<child-component></child-component>
</div>
</template>
<script>
import ChildComponent from './ChildComponent.vue';
export default {
components: {
ChildComponent,
},
provide() {
return {
message: 'Hello from parent!',
};
},
};
</script>
子组件：htmlCopy
<template>
<div>
<h1>{{ message }}</h1>
</div>
</template>
<script>
export default {
inject: ['message'],
};
</script>