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

传递数据

<template>

<div id="app">

    <router-link :to="{path: '/page', query:{page}}">router-link传值</router-link>

           <div @click='goPage()'>方法传值</div>

</div>
</template>


<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>


猜你喜欢

转载自blog.csdn.net/weixin_42460570/article/details/81060666