nuxt--動態路由

由於公司最近在作seo的優化，用的是nuxt，沒有作ssr，因此只能作一些基礎的優化.

 

動態路由：把頁面跳轉的連接改一下

----------變成了----------------->

 

雖然我也沒太懂爲何這樣作就算是對seo的一點基礎優化了（有朋友知道，望解答）

其實我也百度了不少教程，可是都沒怎麼看懂，最後在技術胖那的一個視頻中看明白了，在實踐過程當中，仍是夭折了（緣由就是這個單詞寫錯了，感受要被本身蠢哭）。

　　　　

這是個人項目名和它的詳情頁

這時候就須要建立一個新文件，跟index.vue同級，

名字呢就姑且取名爲_id.vue

爲何前面有個_呢，至關於這就是動態路由的標誌。

　　　　

　以前頁面之間的跳轉是用的router-link,query傳的值

　　　　

在子頁面接收值是用的 $route.query.projectId（ps：query後面的變量和接收使用的是同一個）

利用動態路由以後，接受值就是$route.params.id（ps：params後面的參數就是_後面的文件名，例如_haha.vue，那麼就是$route.params.haha）

這個時候頁面的跳轉就能夠直接用a標籤跳轉了

　　　　

 由於courseId是後臺傳過來的字段名，因此這裏也就直接寫上去了，item是由於我這有個循環，item拿到循環裏面的每一項。

這樣子這個頁面跳轉的連接就處理好了。(排版很醜啊，隨意記錄學習歷程)