---
# System prepended metadata

title: 第四週小組任務
tags: [每週小組任務]

---

#  第四週小組任務
###### 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||