父子組件傳值
? ? ? ? 詳情可以看文章
跨組件傳值
????????Vue 的核?是單向數據流。所以在父子組件間傳值的時候，數據通常是通過屬性從?組件向?組件，??組件通過事件將數據傳遞回?組件。多層嵌套場景?般使?鏈式傳遞的?式實現provide+inject的?式適?于需要跨層級共享數據的場景，但需要注意不要濫?。如果組件層級較深，且需要在多個組件之間共享狀態，可以使? Vuex 或 Pinia 等狀態管理?具。
? ? ? ? 多層嵌套傳值：
? ? ? ? 現在有三個組件，也就是爺爺、爸爸、兒子三個組件。
1.在父組件中使用provide，傳遞需要傳遞的數據。格式:provide('該數據的唯一標識名',數據)
2.在子組件中使用inject,接收傳遞來的數據。格式:const obj = inject('該數據的唯一標識名')
<!--App.vue-->
<script setup>
import {provide, ref} from "vue";import mymiddle from './middle.vue'const myobj = ref({name: "John",email: "john@gmail.com"})provide("objId", myobj)</script>
<template><p>我是爺爺組件</p><mymiddle></mymiddle>
</template><style scoped>
</style><!--middle.vue-->
<script setup>
import foot from './foot.vue'
</script><template><p>我是爸爸組件</p><foot></foot>
</template><!--foot.vue-->
<script setup>
import {inject, ref} from "vue";const getobj = inject("objId")</script><template><p>我是兒子組件</p><p>接收的數據:{{getobj}}</p>
</template>? ? ? ? 注意，這個模式只能用在多層嵌套中，由祖輩往下傳，不能下往上傳。同樣的，同級之間也不能直接傳。
跨組件傳函數
? ? ? ? 傳遞操作與傳遞值一樣。有一點需要注意：函數傳遞給后輩組件之后，在后輩組件中觸發，執行的對象不會變。例如該函數是給原組件中的num的值+1，那么傳遞給后輩組件并在其中觸發，修改的還是原組件中的num的值。
)
