手记

vue params 链接传值

HelloWord.vue

<template>
  <div class="hello">
    <h1>{{msg}}</h1>
    <router-link :to="{ name:'children', params: {id: 222,cid:333} }">
      显示
    </router-link>
  </div>
</template>

children.vue

<template>
    <div>{{ id }}--{{ cid }}</div>
</template>
<script>
export default {
    name:'children',
    data(){
        return{
            id:'',
            cid:''
        }
    },
    created(){
        this.id = this.$route.params.id,
        this.cid = this.$route.params.cid
    }
}
</script>
<style scoped>

</style>

router.vue

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import children from '@/components/children'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    },
    {
      path:'/detail/:id',
      name:'children',
      component:children
    }
  ]
})

记录一下!

0人推荐
随时随地看视频
慕课网APP