首先我们得在router文件中
import PreciousDetail from "../components/gameList/PreciousDetail.vue"
export default new Router({
routes: [
{
path: "/preciousDetail/:game_phase?:share_id",//这里是我们定义的路由参数
component: PreciousDetail,
meta: {title: "language.precious_detail"}
}
]
通过vue中的路由问号传参,设定我们需要的路由参数。
在组件的方法中写一个跳转路由的方法,目的是将路由参数传递过去。
shareGame(game){
this.$router.push(`/preciousDetail/${game.game_phase}?share_id=001`);
}
在页面跳转过来之后显示的URL是
http://localhost:8080/#/preciousDetail/241?share_id=001
根据跳转页面之后我们要从地址栏中拿到我们想要的参数
包括params值和query值,当然我们要拿到相应的值,需要通过
this.$route.params.game_phase
this.$route.query.share_id
分别拿到。
然后在相应的跳转后的页面中根据拿到的值,进行我们相应的处理。
handleShareFn(){
if(this.$route.query.share_id == '001'){
console.log(1);
}
}