动态路由

src/router/index.js

@@ -1,13 +1,13 @@
 import Vue from 'vue'
 import Router from 'vue-router'
 import HelloWorld from '@/components/HelloWorld'
-import Goods from '@/view/goods'
+import Test from '@/view/test'
 
 Vue.use(Router)
 
 export default new Router({
   routes: [{
-    path: '/test',
+    path: '/test/:testId',
     name: 'test',
     component: Test,
   }]

src/view/goods.vue

@@ -1,13 +0,0 @@
-<template>
-	<div class="goods">
-		This is goods
-		<span>{{$route.query.goodsId}}</span>
-	</div>
-</template>
-<script>
-export default {
-
-}
-
-</script>
-<style scoped></style>

src/view/test.vue

@@ -0,0 +1,17 @@
+<template>
+  <div class="test">
+  	This is id: {{$route.params.testId}}
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      msg: 'hello vue'
+    }
+
+  }
+}
+
+</script>
+<style scoped></style>