---
# System prepended metadata

title: 第二週作業挑戰
tags: [Vue 直播班 DLC - 2023 冬季班]

---

# 第二週作業挑戰


## 依照規則完成輪播功能

![Mar-29-2024 15-02-11](https://hackmd.io/_uploads/SJYFvyVJR.gif)


## 流程：

1. Fork 此專案（需要註冊）：https://stackblitz.com/edit/vitejs-vite-n4q2ci?file=src%2Fcomponents%2FSlideComponent.vue
2. 僅修改 SlideComponent 檔案
3. 正確完成輪播功能
4. 可以翻 Vue 官網文件

## 自我檢查

提交之前，請確保完成以下項目：
- 只有修改到 SlideComponent
- 前、後輪播功能皆可正確運作


## 回報流程

將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔! 
解答位置請參考下圖（需打開程式碼的部分觀看）

![](https://i.imgur.com/vftL5i0.png)


:::info

|        Level        | 說明                           |
|:-------------------:|:------------------------------ |
|   **LV1**   | 完成輪播範例     |
|   **LV2**   | 開啟錄影，在 30 分鐘內完成此挑戰，並上傳至 YT 附上挑戰影片（從看到程式碼開始計算）  |

---

### 回報區

|  #  | Level | Discord | CodePen / 答案 |
|:---:|:----- |:-------:|:--------------|
| 1 | LV1 | Casper[範例解答] | 沒有範例解答|
| 2 | LV1 | Leo | [stackblitz](https://stackblitz.com/edit/vitejs-vite-edc6jc?file=README.md)| 
| 3 | LV1 | 銀光菇 | [stackblitz](https://stackblitz.com/edit/vitejs-vite-d6c2mh?file=src%2Fcomponents%2FSlideComponent.vue)| 
| 4 | LV1 | Ataraxia | [stackblitz](https://stackblitz.com/edit/vitejs-vite-nw9qvp?file=src%2Fcomponents%2FSlideComponent.vue) |
| 5 | LV1 | Ivy | [stackblitz](https://stackblitz.com/edit/vitejs-vite-cp4byy?file=src%2FApp.vue,src%2Fcomponents%2FSlideComponent.vue) |
| 6 | LV1 | Uli | [stackblitz](https://stackblitz.com/edit/vitejs-vite-dnfpyz?file=src%2Fcomponents%2FSlideComponent.vue) |


<!-- 
| no | LV | name | [stackblitz]() |
-->