vue路由传值及接收传递数据

传递数据

<template>
  <div id="app">
    <router-link :to="{path: '/page', query:{page}}">router-link传值</router-link>
    <div @click='goPage()'>方法传值</div>
  </div>
</template>

JS

<script>
export default {
    data () {
       return {
         page：‘传递数据’
       }
    }

    methods:{
        goPage(){   //路由传值
           this.$router.push({name:'page',params:{msg:page}})   
        },
    }

}
</script>

接收数据

<template>
    <div id="page">
        {{$route.query.page)}}
    </div>
</template>

<script>
export default {
  data () {
    return {
        
    }
  },
  created(){   
     console.log(this.$route.query)
     console.log(this.$route.params.msg)
  }
}
</script>

 

 

喜欢上方小程序,需要源码的,添加博主微信私信小编.