❤本篇博客參考愛心老師Ewall的簡書
一、路由動態的適用場景
比如在寫商品詳情頁面的時候，頁面結構都一樣，只是商品id的不同，所以這個時候就可以用動態路由動態。
二、動態路由的官方文檔
傳送地址：https://router.vuejs.org/zh-cn/
可以在一個路由中設置多段“路徑參數”，對應的值都會設置到$route.params中。例如：
三、動手操作一下吧
♥ 1.先動手試一下上面表格中第一個模式的實現，在我們之前創建的my-first-project的src文件夾下新建一個文件夾並命名為view
然后在文件夾下新建test.vue，（沒創建項目的可參考我這篇：https://www.cnblogs.com/crystral/p/9061839.html）
♥ 2.打開test.vue文件（可用sublime、webstorm等）
♥ 3.到my-project->src->router->index.js文件，打開並輸入（我是用webstorm打開的，之前學JS也是用webstorm寫）
♥ 4.再到test.vue組件中輸入：
在這里說明一下，$router.params.testId的意思，當然是獲取當前路由的參數
♥ 5.運行項目 （也可以用cnpm run dev）cnpm 會快一點
出現下面這個之后
♥ 6.打開瀏覽器，輸入localhost：8080
以上表格中的第一個模式就完成了，第二個模式同理
♥ ① 修改路由index.js文件
♥ ② 修改test.vue文件
♥ ③ Ctrl+S保存之后，打開瀏覽器
以上，完成~~~