3個頁面之間互相傳值，取值
app.vue(父級頁面)
first.vue（子級頁面）
second.vue（子級頁面）
先聲明頁面情況:把數據定義在app.vue（父級）中，first.vue（子級）需要拿到定義在app.vue（父級）中的數據，second.vue（子級）需要通過app.vue(父級)來到拿到first.vue（子級，和second.vue是兄弟【同級】）中點擊的某一個元素
app.vue（父級）中
<template>
<first :resourceChild="resource" @fatherHomeClick="selectResource"></first>
<second :detialsResource="selectedResource"></second>
</template>
<script>
import{toRefs,reactive} from "vue"
import first from "first.vue的路徑"
importsecond from" second.vue的路徑"
export default{
components:{
first,
second
},
setup(){
const data= reactive({
})
這里的數據就是用來接收子級first.vue中傳遞過來的數據
return{ .../toRefs(data)，selectedResource，selectResource }
}
}
</script>
注釋：
1. :resourceChild="resource" 詳解：:resourceChild是傳給子級first.vue，因為在app.vue中進行了聲明resource是數據名，所以這句話的意思就是通過:resourceChild把數據傳遞到first.vue中； @fatherHomeClick="selectResource"中@fatherHomeClick是子級中定義注冊的一個點擊事件，這個是點擊事件的名稱，selectResource是app.vue中的一個點擊事件，后面不能接（）
2. :detialsResource="selectedResource"詳解： :detialsResource是綁定屬性的形式傳值，selsectedResource是父級中定義的，而detialsResources是在子級中進行接收的
3. 因為數據要解包，所以用到toRefs，需要在app.vue的頂部進行引用
4. 因為要寫數據，所以需要用到reactive，也是需要在app.vue的頂部進行引用
first.vue(是app.vue的子級，是first.vue的兄弟【同級】)中
<template>
</template>
<script>
<script>
注釋：
1. props:{resourceChild:{}} 詳解:props是用來接收父級傳入的值得，而resourceChild是用來接收值得名稱，這里的resourceChild是不能隨意起名字的，需要同父級綁定的名稱一樣才可以，當拿到數據后，就可以對數據拆分，拿到自己想要的數據。但是這個里拿到的數據還是一個數組的形式，當數據多條的時候可以采用v-for循環來獲取對應的數據
2.<li v-for=" item in resourceChild" :key="item._id" @click="onItemClick(item)" class="list-group-item d-flex justify-content-between bg-light resource-list-item"> 詳解：當拿到數據的resourceChild，是一個數組，通過v-for循環的方式來展現出每一條數據，item in resourceChild就是來循環出每一條數據的，而現在的每一條數據就是用item來代替，所以當id獲取的方式就是item._id,@click = onItemClick(item)，這里為什么是傳的item ,因為是的點擊事件是為了要清楚的知道點擊的是哪一個/那一條，就要傳點擊事件的本身（對象），所以是item,當進行事件注冊的時候，是方便數據在app.vue中進行中轉傳入到second.vue中進行展示
second.vue(是app.vue的子級，是first.vue的兄弟【同級】)
<template>
</template>
<script>
<script>
注釋：
1.props :{detialsResource:{}}詳解： props是用來接收數據的。接收從父級 selectedResource處獲取的數據，在通過屬性綁定的形式傳遞給detialsResource，然后根據對應的展示，展示出id，type ,description...
2.進行了一次判斷v-if和v-else 因為在沒有點擊的情況下左側是空的，所以進行一次傳值點擊之前的判斷，判斷！detialsResource的id有沒有，當沒有情況下給出提示，當點擊之后，有id的時候就正常顯示
本段難點：
1。通過中轉的方式來拿到數據，也就是常說的兄弟頁面之間怎么獲取，或者是傳值，（其實就是通過a傳B傳c,中間的B就是父級，a和c都是子級，也是彼此的兄弟）就是在a中注冊事件，傳給B,在B中進行中轉賦值，屬性綁定在傳給c
2。子級獲取父級的元素(數據)，父級通過綁定，子級通過props來接收