BadGirl_Xiao

导航

Vue通过路由 query传递参数

父组件通过query来传递num参数为1,相当与在 url 地址后面拼接参数

<template>  
    <div>  
        <h3>首页</h3>  
        <router-link :to="{ path:'/home/game', query: { id:  1} }">  
            <button>显示<tton>  
        </router-link>  
  
        <router-view></router-view>  
    </div>  
</template>  

子路由中通过 this.$route.query.num 来显示传递过来的参数  

<template>  
    <h3>王者荣耀{{ this.$route.query.id}}</h3>  
</template>  
地址:http://localhost:3333/#/index?id=001
结果:001
console.log(this.$route.query.id)

posted on 2017-12-08 10:55  BadGirl_Xiao  阅读(532)  评论(0编辑  收藏  举报