nuxt--動態路由


因為公司最近在做seo的優化,用的是nuxt,沒有做ssr,所以只能做一些基礎的優化.

 

動態路由:把頁面跳轉的鏈接改一下

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

 

雖然我也沒太懂為什么這樣做就算是對seo的一點基礎優化了(有朋友知道,望解答)

其實我也百度了很多教程,但是都沒怎么看懂,最后在技術胖那的一個視頻中看明白了,在實踐過程中,還是夭折了(原因就是這個單詞寫錯了,感覺要被自己蠢哭)。

    

這是我的項目名和它的詳情頁

這時候就需要創建一個新文件,跟index.vue同級

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

為什么前面有個_呢,相當於這就是動態路由的標志。

    

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

    

在子頁面接收值是用的 $route.query.projectId(ps:query后面的變量和接收使用的是同一個)

利用動態路由之后,接受值就是$route.params.idps:params后面的參數就是_后面的文件名,例如_haha.vue,那么就是$route.params.haha

這個時候頁面的跳轉就可以直接用a標簽跳轉了

    

 因為courseId是后台傳過來的字段名,所以這里也就直接寫上去了,item是因為我這有個循環,item拿到循環里面的每一項。

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

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM