vue路由傳值

vue路由傳值得幾種方式

　　1.params傳值：

　　傳遞：（修改路由后等同於：<router-link :to="'/user/'+item.id">傳值</router-link>方式）

    toSecond() {

　　　　  let form= {

          name: "admin",

          age: 12

        }

   　　this.$router.push({
        name: "data-second",
        params: form
      });
    }

　　接收：

   mounted() {
    let params = this.$route.params;
    console.log(params);
    params && (this.form = params);
  },

但你會發現一個問題，接收參數得頁面一刷新傳遞得值就沒了，那咋辦啊？

解決方法是在路由那里配一下，路徑后邊加上參數：

    {
          path: "/data-second/:name/:age",
          name: "data-second",
          meta: {title: '接參'},
          component: () => import("@/view/data-bus/index-second")
        },    

這樣頁面刷新也不會丟失了，因為頁面路徑變了：http://localhost:8080/#/data-second/admin/12

　　2.query傳值：

　　傳遞：（等同於：<router-link :to="'/user/?id='+item.id">傳值</router-link>方式）

    toThird() {

　　　　  let form= {

          name: "admin",

          age: 12

        }

   　　this.$router.push({ name: "data-second", query: form }); }

　　接收：

  mounted() {
    let query = this.$route.query;
    console.log(query);
    query && (this.form = query);
  }

　　它得傳遞方法是拼接到路徑后邊得，所以刷新頁面數據也不會丟失