2023 Vue直播班筆記 - 動態路由
閱讀時間約 1 分鐘
此筆記僅以個人清楚理解的方式記錄
前言
假設有一個賣場，裡面有 100 個商品，我們不可能針對它們創 100 對應的路由，因此我們需要一個動態路由，利用路徑帶參數的方式來撈取商品的資訊
環境
一樣先建立好路由及頁面準備
頁面
路由
這邊能知道當我們路徑處於 "/users" 時，會展示 GetUser.vue ，而 GetUser.vue 這邊先以 "https://randomuser.me/api/" 做示範，查看 console 確定是否有成功獲取，並點開來看 seed 獲取的資訊編號
由於該 API 是隨機獲取，如果還想要指定同個資訊獲取的話，可以在請求API上加上參數如圖
動態路由
上述都是一般路由使用方法，以下開始進入主題，我們先建立好動態路由器，很清楚看到後面多了 "/:id" ，這邊 id 可以自行定義，用於匹配 /users 後面的路徑，我們就是要利用該路徑才撈取資訊。
組件內的API也要稍作更改，加上 "this.$route.params.id" 來獲取 /users 後面的路徑，剛剛是設定 id 所以這邊也以 id 來獲取以下為調整後的組件
這樣一來只要 /users 後面路徑帶有參數，我們就能利用該參數來獲取該對應的資訊了。
- joker
- 2024/02/21
留言0
查看全部
你可能也想看
Google News 追蹤
這個秋，Chill 嗨嗨！穿搭美美去賞楓，裝備款款去露營⋯⋯你的秋天怎麼過？秋日 To Do List 等你分享！
秋季全站徵文，我們準備了五個創作主題，參賽還有機會獲得「火烤兩用鍋」，一起來看看如何參加吧～
美國總統大選只剩下三天， 我們觀察一整週民調與金融市場的變化（包含賭局）， 到本週五下午3:00前為止， 誰是美國總統幾乎大概可以猜到60-70%的機率， 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
Faker昨天真的太扯了，中國主播王多多點評的話更是精妙，分享給各位
王多多的點評
「Faker是我們的處境，他是LPL永遠繞不開的一個人和話題，所以我們特別渴望在決賽跟他相遇，去直面我們的處境。
我們曾經稱他為最高的山，最長的河，以為山海就是盡頭，可是Faker用他28歲的年齡...
從 Vue 班畢業已經 1 個多月，最近也轉職成功，終於有機會把這段歷程記錄下來，當作一個里程碑。此次參加 Vue 班，心境上最大的不同，大概是知道自己即將在完課後，踏上求職道路。所以如果能在課堂期間 2 個月內完成求職作品，我就能提早出發。
▍學習狀況
雖然先前有稍微玩過 Vue，但也早已
這些那些關於即將成為過去的那一年
在這個名之為我的小宇宙
泛起過一片漣漪
和其他生命的交會與告別
或久別重逢
或不如歸去
留下些什麼
我們就逐漸長成那個模樣
記憶的刻痕是我們選擇的事實
似真還假
孰是孰非
有何干係
物質構築的既成事實
缺席的不在場證明
幫大家標示容易走錯的幾個路口，希望可以幫助大家的旅途順利~ 嘗試用圖文方式記錄遊記，好像讀起來更生動了。
為什麼會參加這個課程
2022年是個不一樣的年，因為當初自學由設計轉前端工程師、一路上跌跌撞撞因為想要把基底打穩所以今年下定了決心從2022切版班、Js直播班、一路跟到目前2022秋季Vue直播班。
Vue直播班的心得
前兩週其實都還跟得上，但到了第三週對我而言確實感覺有些難了啊～正在心裡徬徨第三週
新年一年新的開始，最近事情太多，本想說寫點什麼的...但最近真的工作遇到些瓶頸，剛好在年底把這些不順遂的事情一併都處理掉了，稍微有點時間可以好好的敘述一下最近發生的事情。是這樣的，我前份工作傳統產業做得不太開心，本人的職業是平面設計師，據大家的認知傳產從上到下都是親戚接管事業，當然我的工作也不例外，
欲說還休，欲說還休，卻道天涼好個秋
想來也到了「欲說還休」的時候了。
是年紀的增長多了顧慮，還是收斂了自己的負面情緒，或者，只是懶了，我在也不像從前能在FB上po出長文。不管當下的情緒多麼澎派，多想要發表言論，回到家了，坐在電腦前面，就沒了發文的欲望了。
其實也有點擔心，難道已經被速食文化變得淺薄了
2023
1.我希望我可以自由的工作、開心的工作、利用我的工作能力我自己賺到生活費。
2.我希望我可以有車子、讓我自由的旅行、享受大自然、我並不是想要在家裡放一台車、而是可以讓我隨時隨時都有一台車。
3.我希望我可以去一些國家旅行想去泰國、加拿大，芬蘭、歐洲。
4.我想瘦到我想要的體重。
這個秋，Chill 嗨嗨！穿搭美美去賞楓，裝備款款去露營⋯⋯你的秋天怎麼過？秋日 To Do List 等你分享！
秋季全站徵文，我們準備了五個創作主題，參賽還有機會獲得「火烤兩用鍋」，一起來看看如何參加吧～
美國總統大選只剩下三天， 我們觀察一整週民調與金融市場的變化（包含賭局）， 到本週五下午3:00前為止， 誰是美國總統幾乎大概可以猜到60-70%的機率， 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
Faker昨天真的太扯了，中國主播王多多點評的話更是精妙，分享給各位
王多多的點評
「Faker是我們的處境，他是LPL永遠繞不開的一個人和話題，所以我們特別渴望在決賽跟他相遇，去直面我們的處境。
我們曾經稱他為最高的山，最長的河，以為山海就是盡頭，可是Faker用他28歲的年齡...
從 Vue 班畢業已經 1 個多月，最近也轉職成功，終於有機會把這段歷程記錄下來，當作一個里程碑。此次參加 Vue 班，心境上最大的不同，大概是知道自己即將在完課後，踏上求職道路。所以如果能在課堂期間 2 個月內完成求職作品，我就能提早出發。
▍學習狀況
雖然先前有稍微玩過 Vue，但也早已
這些那些關於即將成為過去的那一年
在這個名之為我的小宇宙
泛起過一片漣漪
和其他生命的交會與告別
或久別重逢
或不如歸去
留下些什麼
我們就逐漸長成那個模樣
記憶的刻痕是我們選擇的事實
似真還假
孰是孰非
有何干係
物質構築的既成事實
缺席的不在場證明
幫大家標示容易走錯的幾個路口，希望可以幫助大家的旅途順利~ 嘗試用圖文方式記錄遊記，好像讀起來更生動了。
為什麼會參加這個課程
2022年是個不一樣的年，因為當初自學由設計轉前端工程師、一路上跌跌撞撞因為想要把基底打穩所以今年下定了決心從2022切版班、Js直播班、一路跟到目前2022秋季Vue直播班。
Vue直播班的心得
前兩週其實都還跟得上，但到了第三週對我而言確實感覺有些難了啊～正在心裡徬徨第三週
新年一年新的開始，最近事情太多，本想說寫點什麼的...但最近真的工作遇到些瓶頸，剛好在年底把這些不順遂的事情一併都處理掉了，稍微有點時間可以好好的敘述一下最近發生的事情。是這樣的，我前份工作傳統產業做得不太開心，本人的職業是平面設計師，據大家的認知傳產從上到下都是親戚接管事業，當然我的工作也不例外，
欲說還休，欲說還休，卻道天涼好個秋
想來也到了「欲說還休」的時候了。
是年紀的增長多了顧慮，還是收斂了自己的負面情緒，或者，只是懶了，我在也不像從前能在FB上po出長文。不管當下的情緒多麼澎派，多想要發表言論，回到家了，坐在電腦前面，就沒了發文的欲望了。
其實也有點擔心，難道已經被速食文化變得淺薄了
2023
1.我希望我可以自由的工作、開心的工作、利用我的工作能力我自己賺到生活費。
2.我希望我可以有車子、讓我自由的旅行、享受大自然、我並不是想要在家裡放一台車、而是可以讓我隨時隨時都有一台車。
3.我希望我可以去一些國家旅行想去泰國、加拿大，芬蘭、歐洲。
4.我想瘦到我想要的體重。