vue-resource

package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "vue": "^2.5.2",
+    "vue-resource": "^1.5.1",
     "vue-router": "^3.0.1"
   },
   "devDependencies": {

src/App.vue

@@ -2,6 +2,8 @@
   <div id="app">
     <img src="./assets/logo.png">
     <router-view/>
+    <router-view name="title1"/>
+    <router-view name="title2"/>
   </div>
 </template>
 

src/main.js

@@ -1,8 +1,9 @@
-// The Vue build version to load with the `import` command
-// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
 import Vue from 'vue'
 import App from './App'
 import router from './router'
+import VueResource from 'vue-resource'
+
+Vue.use(VueResource)
 
 Vue.config.productionTip = false
 

src/router/index.js

@@ -11,24 +11,7 @@ Vue.use(Router)
 export default new Router({
   routes: [{
     path: '/test',
-      name: 'HelloWorld',
+    name: 'test',
     component: Test,
-      children: [{
+  }]
-          path: 'Title1',
-          name: 'Title1',
-          component: Title1
-        },
-        {
-          path: 'Title2',
-          name: 'Title2',
-          component: Title2
-        }
-      ]
-    },
-    {
-      path: '/goods',
-      name: 'goods',
-      component: Goods
-    }
-  ]
 })

src/view/test.vue

@@ -1,17 +1,6 @@
 <template>
   <div class="test">
-  	<!-- 动态路由 -->
+    <button @click="get">click me</button>
-    This is id : {{$route.params.testId}}
-    <br/> 
-    This is name : {{$route.params.testName}}
-
-    <!-- 嵌套路由 -->
-    <router-link to="/test/title1">标题1</router-link>
-    <router-link to="/test/title2">内容2</router-link>
-    <router-view></router-view>
-
-    <!-- 编程式路由 -->
-    <div @click="gotoGoods">跳转到商品详情页面</div>
   </div>
 </template>
 <script>
@@ -22,18 +11,17 @@ export default {
     }
   },
   methods: {
-		gotoGoods() {
+    get() {
-			// this.$router.push('/goods');
+      this.$http.get('package.json', {
+        params: {
           
-      // this.$router.push({
+        },
-      //   path: '/goods?goodsId=666'
+        headers: {
-      // });
+          token: '123'
-      this.$router.push({
-        path: '/goods',
-        query:{
-          goodsId:666
         }
-      });
+      }).then(res => {
+        this.msg = res.data;
+      })
     }
   }
 }