---
# System prepended metadata

title: VUE直播班第四週小組任務-第3組

---


# VUE直播班第四週小組任務-第3組
## 小組討論時間-1/22(一)晚上8點~9點
## 參與名單
|      成員       |    簽到   |
|:--------------:|:--------:|
|   MY           |     ✓    |
|   macihuang    |     ✓    |
|   Vivian2857   |     ✓    |
|   KUN.         |     ✓    |
|   TTedd        | (有事請假)  |
|   BS           |     ✓    |
|   Yue9527      |     ✓    |
|   Ariel        |     ✓    |
|   camellou     |     ✓    |

# 問題
## 挑戰一：使用 Figma 或各種繪圖工具，完成元件上下之間的溝通方式
包含：父傳子的 Props、子觸發父事件、水平（子觸發父事件、父在傳入另一個子元件）


請看此[範例](https://codepen.io/Wcc723/pen/OJpxVJb?editors=0010)並用圖片說明如何運作（範例如下，下圖絕對是錯誤的）
![image](https://hackmd.io/_uploads/S1oabYCI6.png)



## 挑戰二：Git 挑戰
完成 [Git 任務三](https://hackmd.io/8uEPk1GeTBCl8lUQfD5b5Q?view)

# 作答區

## 一、挑戰一
|      成員       |    截圖   |
|:--------------:|:--------:|
|   MY           | ![螢幕擷取畫面 2024-01-22 203131](https://hackmd.io/_uploads/ryUNx12Kp.jpg)![螢幕擷取畫面 2024-01-21 194555](https://hackmd.io/_uploads/SJLVe13KT.jpg)![螢幕擷取畫面 2024-01-21 194313](https://hackmd.io/_uploads/Sk8Eey3Fp.jpg)|
|   macihuang    |  ![截圖 2024-01-22 下午9.31.07](https://hackmd.io/_uploads/BkLbkxntp.png)![截圖 2024-01-22 下午9.26.13](https://hackmd.io/_uploads/ByLW1x2YT.png)|
|   Vivian2857   |          |
|   KUN.         |          |
|   TTedd        |          |
|   BS           |          |
|   Yue9527      |    ![props](https://hackmd.io/_uploads/r1zXtW3Ya.png) ![emit](https://hackmd.io/_uploads/SyY7YZ2Fa.png)|
|   Ariel        |![props、emit](https://i.imgur.com/OZXYoxs.png) |
|   camellou     |          |






### 挑戰一討論過程截圖
![1](https://hackmd.io/_uploads/HkWqtyntT.jpg)

![2](https://hackmd.io/_uploads/rJZ9tJ3FT.jpg)

![3](https://hackmd.io/_uploads/SkWqFyhYa.jpg)



## 二、挑戰二

| 成員一  |   成員二   |  Github  |
|:------:|:---------:|:--------:|
|  Ariel |  Yuetin   | [Github網址](https://github.com/Ariel0508/test0122) |
|  KUN.  |    MY     | [Github網址](https://github.com/ahmomoz/test1031) |
|  Maci  |  Vivian   | [Github網址](https://github.com/Viiivian/GitTaskThree)|

## 三、課後團隊測驗
### 作答成員各自的答案
![000](https://hackmd.io/_uploads/SJSXtJ2K6.jpg)


### 問題討論過程截圖
![11](https://hackmd.io/_uploads/S1pXYy3t6.jpg)

![12](https://hackmd.io/_uploads/ByTXtkhtT.jpg)

![13](https://hackmd.io/_uploads/Sk6XKknF6.jpg)

![14](https://hackmd.io/_uploads/HyTQty3Fp.jpg)

![15](https://hackmd.io/_uploads/H16mK12t6.jpg)
