Vue頁面跳轉(zhuǎn)帶參數(shù)要怎么做？動力節(jié)點小編來給大家舉例說明。在vue框架的前端頁面上，若要實現(xiàn)頁面之間的帶參數(shù)跳轉(zhuǎn)，可參考以下實現(xiàn)過程：

例如，點擊截圖中的“查看試卷”，可實現(xiàn)帶參跳轉(zhuǎn)到相應(yīng)的試卷頁面，該功能類似查看試卷的詳情頁面：

假如以上所在頁面為“試卷管理.vue”，需跳轉(zhuǎn)到頁面為“查看試卷.vue”。

1.在試卷管理.vue頁面里，點擊“查看試卷”按鈕的相應(yīng)代碼如下：

 <span @click="seeExa(scope.row)" class="mr15">查看試卷</span>

2.點擊后會執(zhí)行對應(yīng)的seeExa(e)方法，把實現(xiàn)跳轉(zhuǎn)的代碼寫到該方法里，代碼如下：

seeExa(e) {
window.console.log("查詢成功", e);
this.$router.push("/Exa/" + e.id+"/"+e.paperName);
}

注釋："/Exa/"為“查看試卷.vue”頁面對應(yīng)的路由名字，斜桿后面的e.id+"/"+e.paperName為跳轉(zhuǎn)帶的參數(shù)。

3.在該頁面對應(yīng)的路由需配置相應(yīng)屬性信息，即path: "/Exa/:id/:name"：

 path: "/Exa/:id/:name",
 name: "Exa",
 component: Exa

完成以上的代碼，就可以頁面之間的帶參數(shù)跳轉(zhuǎn)了，這種方法會在url后面顯示出屬性值信息，存在一定的安全風險。

4.最后一步，就是在“查看試卷.vue"頁面進行參數(shù)的接收，利用“this.$route.“工具便可以接收：

created: function() {
    this.myId = this.$route.params.id;
    this.myName=this.$route.params.name;
  }

根據(jù)以上方式，便可實現(xiàn)vue頁面之間帶參數(shù)的跳轉(zhuǎn)了