# 🏅 6/17 (四) 每日任務 Day 39 ###### tags: `Vue 直播班 - 2021 夏季班` 題目 (請將答案貼上 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-2021/lectures/31862753 回報流程 --- 請同學依照下圖教學觀看解答、回報答案: ![](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 } ] }) --> 回報區 --- <!-- 1: Lina Chen CodePen: https://codepen.io/LinaChen/pen/KKWJogQ --> <!-- 2: Vic CodePen: https://codepen.io/hsuan333/pen/VwpgXbv --> <!-- 3:陳sam Codepen: https://codepen.io/euldpliv/pen/YzZBaNy?editors=1111 --> <!-- 4.ifang/iva Codepen: https://codepen.io/Hsu1Fang/pen/NWpoYVB --> <!-- 5: Alysa Chan Codepen: https://codepen.io/alysachan/pen/LYWqdMG?editors=1111 --> <!-- 6: Wendy Li Codepen: https://codepen.io/rockayumitw/pen/RwpvyRj?editors=1010 --> <!-- 7: Ethan codepen: https://codepen.io/blazer030/pen/bGqzMem --> <!-- 8: peter.chen1024 codepen: https://codepen.io/JIAN-RONG/pen/zYZeaxz?editors=1010 --> <!-- 9:RitaHuanag https://codepen.io/Rita-Rossweisse/pen/gOmqKOE?editors=1010 --> <!-- 10: youting codepen: https://codepen.io/youtingluo/pen/XWMOYda?editors=1010 --> <!-- 11: Yi Chieh Codepen: https://codepen.io/Yi-Chieh/pen/NWpozrq --> <!-- 12: Echo Hui codepen: https://codepen.io/echohuiecho/pen/KKWJeOX --> <!-- 13: Joe Kuo codepen: https://codepen.io/alertislow/pen/yLMZqWZ?editors=1010 --> <!-- 14: leolee codepen: https://codepen.io/nekorice/pen/bGqzxLz --> <!-- 15: yijun codepen: https://codepen.io/sandy3068/pen/RwpvqPP --> <!-- 15: Fred Chang codepen: https://codepen.io/fred8196/pen/KKWJbPb --> <!-- 16: Dah codepen: https://codepen.io/fred8196/pen/KKWJbPb --> <!-- 17: Sec codepen: https://codepen.io/Sentiments/pen/ExWrrZb --> <!-- 18: Jay codepen: https://codepen.io/jayredk/pen/wvJNNXM --> <!-- 19: Oober codepem:https://codepen.io/xtsjrjdv/pen/GRWzebv?editors=1111 --> <!-- 20: tim Chou codepem:https://codepen.io/tim-chou/pen/QWpYRVG --> <!-- 21: Jack https://codepen.io/yxzzktmb/pen/rNyPgbd?editors=1010 --> <!-- 22: Larry https://codepen.io/manpower0708/pen/zYZbZmB --> <!-- 23: Jessie Cheng https://codepen.io/JessieMosbi/pen/mdWoXPz --> <!-- 24: Stacey Huang https://codepen.io/staceyhuang/pen/gOmEBEY?editors=1010 --> <!-- 25: Jordan Tseng https://codepen.io/jordan-ttc-design/pen/gOmyRRp --> <!--26: jimmyFang https://codepen.io/pohxiqqo/pen/abJxqzm?editors=1010 --> <!-- Erica https://codepen.io/ericadu/pen/xxqvXLG --> <!--28 YOYO https://codepen.io/lumedkle/pen/NWjKPrx?editors=1010 --> <!--29: Chiang https://codepen.io/ChiangJ/pen/wvdBPvq?editors=1010 --> <!--30: twoz https://codepen.io/twoz/pen/gOWPZLW?editors=1010 -->