params

src/main.js

@@ -32,7 +32,7 @@ const routes = [
   {
     path: '/index', component: index, children: [
       {
-        path: 'foo', component: foo, children: [{
+        path: 'foo/:name/:age', name:"foo", component: foo, children: [{
           path: 'aaa', component: bar
         }]
       },

src/pages/foo.vue

@@ -12,8 +12,17 @@
 export default {
     methods:{
         getzhi(){
+
+            // let a = "小梦"
+            // let b = 18;
+
+            // // let str = "名字是" + a + "年龄是" + b
+            // // 模板字符串
+            // let str = `名字是${a}年龄是${b}`
+            // console.log(str)
             // 如何获取url传值
-            let zhi = this.$route.query
+            // params 传参的时候 不在url显示 刷新之后丢失了
+            let zhi = this.$route.params
             console.log(zhi)
         }
     }

src/pages/index.vue

@@ -4,8 +4,6 @@
       <el-menu
         default-active="2"
         class="el-menu-vertical-demo menu"
-        @open="handleOpen"
-        @close="handleClose"
       >
         <el-menu-item index="2" @click="toindex">
           <i class="el-icon-menu"></i>
@@ -31,10 +29,15 @@ export default {
       this.$router.push("/index")
     },
     tobar(){
+      // "/index/bar" path
       this.$router.push("/index/bar")
     },
     tofoo(){
-      this.$router.push("/index/foo")
+      //  { name  } 才是用name跳转
+      // params 使用这个方式传值 必须使用命名路由 用path跳转传不过去
+      // this.$router.push({ path:"/index/foo",params:{name:"111"} })
+      this.$router.push({ name:"foo",params:{name:"aaaa",age:18} })
+
     }
   },
 };