# 第四週小組任務 ###### tags: `每週小組任務`! ## 挑戰一:團隊成員一起搞定元件觀念 ### 題目:https://codepen.io/Wcc723/pen/OJpxVJb?editors=1010 這是一連串的神秘問題,請問: - 全域註冊的卡片中,有哪幾個是有運用的(card-a, card-b) - 題目上,卡斯伯的卡片、Ray 的卡片,其中何者的 magicData 在初始狀態,就能接收到 "神秘文字" 這四個字 - 畫面上的 卡斯伯的卡片, Ray 的卡片,其中有一個按鈕可完整傳遞資料至另一個,請問是在本範例中是: a. 卡斯伯的卡片 將 {{神秘文字}} 四個字傳至 Ray 的卡片 b. Ray 的卡片 將 {{神秘文字}} 四個字傳至 卡斯伯的卡片 - 請截圖,並說明如何運作 回答: 原圖:https://i.imgur.com/LeJIQA9.jpg ![](https://i.imgur.com/LeJIQA9.jpg) ![](https://i.imgur.com/Fi2i2IF.png) ### 提示: - 其中一個卡片無法接收動態資料 - 請注意,在此有用到 v-bind: 動態屬性,專門傳遞 “變數” - JS 變數使用中文是可以運作的 - 想看答案:可以把 {{magicData}} 加入到元件內,馬上就能了解運作 ## 挑戰二:團隊測驗 完成團隊測驗:https://bejewled-air-4cb.notion.site/0f01125cc7fa45aa99dd3d0c932f57b5 填寫表單:https://docs.google.com/spreadsheets/d/1nJKppCMCfGraYtiM74sf0L6uhw6EOXT3ye3x_02RKaU/edit?usp=sharing |題號|答案回答|正確解答| |-|---|---| |1|3|3|| |2|1|1|| |3|3|3|| |4|1|4|| |5|2|2|| |6|1|1|| |7|2|4|| |8|app.component('card',{ data(){return{text:'這是一段話'} },template:`<div>{{text}}</div>`,}|app.component("card',card)|| |9|<card :outer-text="text"></card>|:outer-text="text"|| |10|2|2|| |11|2|1|| |12|1|1|| |13|<card @send="getData"></card>|@send="getData"|| |14|2|2|| |15|1|1||