<
!doctype html>
"en"
>
"utf-8"
>
路由,重定向, 引數傳遞<
/title>
"../vue.js"
>
<
/script>
"vue-router.js"
>
<
/script>
<
/head>
>
用router-link導航, 並傳引數<
/h3>
<
!--方式1
-->
"/passenger/李四/456788766554434567"
>
/router1<
/router-link>
<
!--方式2
-->
"/flight/kn9628"
>
/router2<
/router-link>
<
!--方式3
-->
<
!--物件方式傳參, name對應元件的name--
>
"}">
/router3<
/router-link>
<
!--方式4
-->
<
!--查詢方式傳參--
>
"}">
/router4<
/router-link>
<
/p>
用button觸發事件導航<
/h3>
<
/p>
"methodnameparam"
>methodnameparam 資訊管理<
/button>
"methodqueryparam"
>methodqueryparam 票務資訊查詢<
/button>
<
!--路由輸出區域--
>
>
"background-color: #e1e1e1; height: 100px; margin: 10px; height:100px; width: 300px; float: left; "
>
顯示區域1
<
/p>
"view1"
>
<
/router-view>
<
/div>
"background-color: #e1e1e1; height: 100px; margin: 10px; height:100px; width: 300px; float: left;"
>
顯示區域2
<
/p>
<
/router-view>
<
/div>
"clear: both"
>
重定向<
/h3>
<
/p>
"/login"
>重定向<
/router-link>
<
/div>
const router =
newvuerouter
(} , 身份證號:}'}
}},}
',props:
['flightno']}
, props:
true
//如果 props 被設定為 true，route.params 將會被設定為元件屬性},
}, 使用者角色: }',
props:
['username'
,'rolename']}
, props:
true},
}'}}
,, alias:
'/aaaaaa'}}
]});
newvue(}
).catch
(data =>);
},methodnameparam:
function()
}).catch
(data =>);
}}})
;<
/script>
<
/body>
<
/html>
vue router引數傳遞
準備工作 第一步 建立新的元件profile.vue profile 配置動態路由 傳遞引數主要有兩種型別 配置路由的格式 router id 傳遞的方式 在path後面跟上對應的值 傳遞後形成的路徑 router 123,router abc query的型別 配置路由的格式 router，也就是...
vue router的引數傳遞
1 新建元件 新建乙個user.vue檔案，新增 2 設定對映 開啟index.js檔案，新增如下 1 新建元件 profile.vue，新增如下 h2 p p div template export default script route.query是乙個物件，裡面是頁面傳過來的資料 2 設定對...
vue router 頁面引數方式
1，命名路由 註冊路由的地方需要給路由命名如下圖 this.router.push 接受方法如下 this.route.params.userid2，查詢引數 查詢引數其實就是在路由位址後面帶上引數和傳統的url引數一致的 使用方法如下 this.router.push 接受方法如下 this.ro...