---
# System prepended metadata

title: "\U0001F3C5 Day 39"
tags: [Vue 直播班 - 2022 春季班]

---

---
tags: Vue 直播班 - 2022 春季班
---

# 🏅 Day 39
###### tags: `Vue 直播班 - 2022 春季班`

題目 (請將答案貼上 CodePen)
---
操作 [這個模板](https://codepen.io/rider159159/pen/eYvexYe)，執行以下要求 (只能操作 JS 的部分):

> 練習使用 pathMatch 進行換頁 (404 頁面設定)
> - 參考課程教學，在 router 中建立 routes 的相關設定。
> - 讓使用者點擊 1 時，會顯示「第一頁」文字、使用者點擊 2 時，會顯示「404」文字。
> - 提示一 : pageTwo 請勿使用 `path: '/aergnorgrea',`
> - 提示二 : 若要指向 404 不存再 router 需設定 `path: '/:pathMatch(.*)*',`

404 頁面導向設定，可參考: https://courses.hexschool.com/courses/vue-20212/lectures/35988936

回報流程
---
請同學依照下圖教學觀看解答、回報答案:

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

回報格式如下圖，請在「回報區」使用註解回報答案 (為了統計人數，請同學依序加上「報數」)

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

<!-- 解答
const router = VueRouter.createRouter({
    history: VueRouter.createWebHashHistory(),
    routes: [
      {
        path: '/pageOne',
        component: pageOne
      },
      {
        path: '/:pathMatch(.*)*',
        component: pageTwo
      }
    ]
  })

-->

回報區
---
| 報數 | 組別-名字  | codepen / 其他回饋    | 
|:--------:| :--------: | -------- | 
|1| Iris Huang | https://codepen.io/ythuang/pen/wvPxBMK |
|2| Jason Chen | https://codepen.io/jason60810/pen/qBVyEZJ |
|3| Larry | https://codepen.io/larrylinr5/pen/mdqjyVN |
|4| 肉鬆 | https://codepen.io/klrkicog/pen/yLPqyXz |
|5| Himi |https://codepen.io/Himi/pen/yLPqyqv|
|6|Aaron Tu|https://codepen.io/aarontu/pen/YzEjPvz|
|7|kevinhes|https://codepen.io/kevinhes/pen/MWOBYGV?editors=1011|
|8|Gill|https://codepen.io/Gill-Chin/pen/RwjBNvr?editors=1010|
|9|POPEYE|https://codepen.io/popeye_ux/pen/jOapEdY|
|10|威爾|https://codepen.io/WILL_Wu/pen/zYPLGNV|
|11|CloThEs|https://codepen.io/bogwdnxx-the-sans/pen/GROBJyv|
|12|Arista|https://codepen.io/arista-hsieh/pen/abVjOgZ|
|13|Yunei|https://codepen.io/Yunei/pen/WNXKQvW|
|14| Sheep | https://codepen.io/SheepNDW/pen/eYejpBZ | 
|15|EmptyWu|https://codepen.io/emptywu/pen/vYWaNea |
|16|陳暐中|https://codepen.io/wei-z/pen/oNoMboO?editors=1011|
|17|Rick Tzeng|https://codepen.io/rick917jp6/pen/GROBoGp |
|18| YC |https://codepen.io/YCLu/pen/ExbpKyB |
|19| Henry wu |https://codepen.io/dkcmlaww-the-flexboxer/pen/oNoMLje?editors=1010 |
|20| Bruno Yu |https://codepen.io/bruno-yu/pen/xxPJOKE |
|21| Pei Ying |https://codepen.io/Pei-Ying/pen/wvPxWeZ?editors=1011|
|22|sally |https://codepen.io/intelligence753/pen/QWOBKRO?editors=1010|
|23|shio|https://codepen.io/shioyen/pen/BamPRaR?editors=1011|
|24|咖咖|https://codepen.io/gon790219/pen/jOapLyy |
|25| 黃士桓 | https://codepen.io/shr-huan-huang/pen/ExbpQKJ |
|26|Calon|https://codepen.io/Calon0118/pen/YzEjajv|
|27|我是泇吟|https://codepen.io/kljuqbxs/pen/LYOBqVw|
|28| Charlotte Lee | https://codepen.io/charlotte-lee/pen/rNYrRPj?editors=1010 |
|29| ZY Hsu | https://codepen.io/zihyin/pen/vYWzNmp?editors=1010 |
|30| andersonshen | https://codepen.io/luxyenni-the-bold/pen/dyZqJew |
|31| Otis | https://codepen.io/humming74/pen/jOavYpy?editors=1010 |
|32|Jasper|https://codepen.io/li-jasper/pen/XWzPLrL |
|33|mei|https://codepen.io/Shila-Chen/pen/XWzyjrm |
|34|Tim Lin|https://codepen.io/TimmyLin/pen/NWwEROW|
|35|Judy☻|https://codepen.io/hsiaohan/pen/BamvOqv?editors=1010|
|36|Bonnie|https://codepen.io/bonnieli1414/pen/bGYOZgW?editors=1010 |
|37|紙飛機| https://codepen.io/paperplanea/pen/ExbBVdw |
| 38 | sihle | https://codepen.io/bugbug777/pen/oNpNBWb |
|39|Mylène| https://codepen.io/hamajibashi/pen/xxpgBbN |
|40|Gui|https://codepen.io/guitimliu/pen/NWXoygj
|41|大衛|https://codepen.io/exnsrpjc/pen/jOYRBLj |
|42|JD孟璁|https://codepen.io/oikdkmxq-the-looper/pen/GRQKvjp |