# 🏅 Day 41 - 商品篩選功能

問題
---
請同學實作「商品篩選」的功能，點擊 select 會呈現相對應類型的商品，如下圖：
> 可以使用此 [CodePen 模板](https://codepen.io/hexschool/pen/dyKOmpg?editors=1011)


## 回報流程

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


<!-- 解答：

請記得填入自己的 API 名稱
https://codepen.io/hexschool/pen/yLEVKXM?editors=1010

若不太清楚要怎麼做可看下方作業提示：

使用監聽事件選擇選單，
選單改變時觸發函式，
函式的部分為讀取選單的內容與 api 中的資料核對，
符合的資料則挑出來加入渲染。
-->

回報區
---
| # | Discord | CodePen / 答案 |
| --- | ----- | ----- |
| 01 | Tatsu | [CodePen](https://codepen.io/chindesu0207/pen/JoPPbmq) |
| 02 | 毛巾 | [Codepen](https://codepen.io/bqdcjboa-the-solid/pen/EaYYNqJ) |
| 03 | tim | [Codepen](https://codepen.io/jskrtivy-the-animator/pen/raBBjEO?editors=1011) |
| 04 | david1819 | [Codepen](https://codepen.io/David-Lin-the-vuer/pen/wBwweWP) |
| 05 | yuyuhunter_0509 | [CodePen](https://codepen.io/KRcube/pen/qEWWrey?editors=0010) |
| 06 | GTR150 | [CodePen](https://codepen.io/Wer-Qwe/pen/emOOyxW?editors=1011) |
| 07 | Ariel | [CodePen](https://codepen.io/ariel0510/pen/YPKKEMx?editors=1010) |
| 08 | chris | [CodePen](https://codepen.io/chris-chen-the-selector/pen/MYggVwP?editors=1010) |
| 09 | Sonia | [CodePen](https://codepen.io/YUJOU/pen/VYZZxvr?editors=1011) |
| 10 | 陳小廷 | [CodePen](https://codepen.io/ting1124/pen/jENErwY) |
| 11 | Chun | [CodePen](https://codepen.io/Chun_debbie/pen/EaYjGaJ?editors=1011) |
| 12| Chun | [CodePen](https://codepen.io/bekgnohe-the-selector/pen/zxOveyN?editors=1010) |
<!-- 可複製下方格式
| | | [CodePen]() |
-->