---
# System prepended metadata

title: "\U0001F3C5 Day 30 - Pinia 整合應用"
tags: [Vue 直播班 - 2022 冬季班]

---

---
tags: Vue 直播班 - 2022 冬季班
---
# 🏅 Day 30 - Pinia 整合應用

嘗試運用前幾天學到的方法完成下方題目需求

### 題目
利用此 [模板](https://codepen.io/hexschool/pen/VwBMOaY?editors=1010)（已有提供部分元件、store 資訊，只需調整 `...` 的部分），
當選擇上方 select 時會出現對應班級的學員

![](https://i.imgur.com/DccZH8Q.gif)
> 操作示意


## 回報流程

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

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

<!-- 解答：  
https://codepen.io/hexschool/pen/KKBXGme?editors=1011
-->




回報區
---


|   Discord    |                    CodePen / 答案                      |
|:----------:|:-------------------------------------------------------:|
|Wendy3#5615 |[Codepen](https://codepen.io/wendy03/pen/MWBZPMP)        |
| albee#9121|[Codepen](https://codepen.io/albee-chang/pen/OJwramz?editors=1011)|
|JackC#0411|[Codepen](https://codepen.io/key0329/pen/gOjZQxX)|
|威0#6919|[codepen](https://codepen.io/n0918679182/pen/qByLJeB?editors=1011)|
|mandylai#4055|[codepen](https://codepen.io/mandy-lai-2/pen/bGjOOeJ)|
|AuroraC#6539|[codepen](https://codepen.io/AuroraC/pen/qByLQwr?editors=1011)|
|薯餅#3581|[Codepen](https://codepen.io/ColdingPoTaTo/pen/rNrooxL)|
|Amberhh#2465|[Codepen](https://codepen.io/Amberhh/pen/YzjdRmY?editors=0011)|
|無名#6427|[Codepen](https://codepen.io/Nomoney/pen/mdjjKxx)|
|冬天#5215|[Codepen](https://codepen.io/winter_/pen/zYLyyXp)|
|Tuhacrt#0008|[codepen](https://codepen.io/Tuhacrt/pen/jOpXdym)|
| yuyu#6310 |[codepen](https://codepen.io/yuyu0905/pen/RwBEdNG?editors=1011)|
|Wendy77#8049|[Codepen](https://codepen.io/Wendy__/pen/wvxRRVa)|
|Jill Lee#0809|[CodePen](https://codepen.io/chi-ling-lee/pen/dyjwaOL?editors=1011)|
|Potatolee#7749|[CodePen](https://codepen.io/potatoleee/pen/QWBzoBz)|
|威爾#1694|[CodePen](https://codepen.io/WILL_Wu/pen/QWBzzrb)|
|楊苡安#2752|[CodePen](https://codepen.io/yi-an-yang/pen/yLqGwQd?editors=1011)|
|Benson#6763|[Codepen](https://codepen.io/kumashow/pen/xxJmBrG)|
|泊岸#3466|[Codepen](https://codepen.io/qoq77416416/pen/PoBXVVW?editors=0010)|
|YI#0863|[Codepen](https://codepen.io/YI0305/pen/MWBZRXj?editors=1010)|
|SASIMI#5099|[Codepen](https://codepen.io/sashimi1327/pen/YzjdMgd)|
|Chi#7605|[Codepen](https://codepen.io/YoChi84/pen/bGjOyag)|
|Rena#6249|[Codepen](https://codepen.io/aureate0116/pen/LYBMoBK)
|DIO大人#4776|[Codepen](https://codepen.io/oscar-2283/pen/oNMJJZE)|
| azami#5986 |[CodePen](https://codepen.io/azami/pen/yLqZBLM)|
|MengLin#3001|[CodePen](https://codepen.io/aacj2642/pen/YzjBGbR?editors=1011)|
|hannahTW#2224|[CodePen](https://codepen.io/hangineer/pen/ExprQbp?editors=0010)|
|ABOOS#6276|[CodePen](https://codepen.io/guhungyin/pen/JjBxQjV?editors=0010)|
|圈圈#4060|[Codepen](https://codepen.io/wjejfczn-the-bold/pen/ZEjPbMP?editors=0011)|
|小木馬#8760|[Codepen](https://codepen.io/wmmtbcsd/pen/eYjXzYK?editors=1010)|
|LinaChen#1796|[Codepen](https://codepen.io/LinaChen/pen/eYjXzKX)|
|yoyo123456#0577|[Codepen](https://codepen.io/hungyoyo/pen/poZYPqr?editors=0011)|
 |Hazel.#6020|[CodePen](https://codepen.io/Hazelhsieh/pen/JjBzZRp?editors=1010)|
|柚子#3958|[CodePen](https://codepen.io/as6625998/pen/GRBeXgM?editors=0011)|
|大衛#4869|[CodePen](https://codepen.io/exnsrpjc/pen/oNMVPPG?editors=1011)|
|int#7518|[Codepen](https://codepen.io/intHuang/pen/bGjZQeq?editors=0011)|
|jacky010080#0880|[CodePen](https://codepen.io/Yen-Jung-Chen/pen/NWBJoXG?editors=1010)|
|阿鑫#4346|[CodePen](https://codepen.io/Neil1024/pen/BaPbEYO?editors=0011)|
| christina#6185 |[Codepen](https://codepen.io/chrisc0210/pen/abjxpQr)|
| Bassjim#0118 |[Codepen](https://codepen.io/unrtxbaq/pen/zYLXwJP?editors=1011)|
|Yiru#0236|[Codepen](https://codepen.io/yiru94/pen/vYaMWwK?editors=1010)|
|出事了阿伯#9923|[Codepen](https://codepen.io/BradpittLai/pen/vYaqyqz?editors=1010)|
| YC#2522 | [CodePen](https://codepen.io/YCLu/pen/Yzjojzj) |
| GOD_QWERTYUIOPLKJLKLLOINJ_MASTER#4922 | [CodePen](https://codepen.io/sho666/pen/dyqoObQ?editors=1011) |
| 阿蘇#8531 | [CodePen](https://codepen.io/susu3131/pen/LYJpEKd?editors=0011) |
| yoyo#1003 | [CodePen](https://codepen.io/pen/MWqeZxZ?editors=1010) |
| ABOOS#6276 | [CodePen](https://codepen.io/guhungyin/pen/bGxwrbe?editors=1010) |
|KC_8685#9343|[Codepen](https://codepen.io/cathy7411/pen/mdGQmgQ)|
| Jenny真#7532 | [CodePen](https://codepen.io/wei-chen-wu/pen/jOvRKYa) |
| Eason#7884 | [CodePen](https://codepen.io/ASLEO/pen/gOBryOz) |

