Vue跳转传值 router-link

1.router-link

<router-link :to="{name:'hi',params:{id:2,text:'judy'}}"></router-link>

2.routers路由

在router的文件夹目录下引入

import hi from '@/components/pages/HelloWorld' //配置路由hi 组件
export default new Router({
  routes: [
    {
      path: '/',
      name: 'pos',
      component: pos
    },
    {
      path: '/hi',
      name: 'hi',
      component: hi
    },
    {
      path: '/hi1',
      name: 'hi1',
      component: hi1
    }
  ]
})

3.取值

<h1>{{$route.params.id }}</h1>
在跳转后的vue页面引用

4、小结:router-link跳转传值要注意的地方 
* to前面要加: 

* to后面{中的name值要与路由中的name值一致 

<router-link :to="{name:'hi',params:{username:'judy',id:2}}">



猜你喜欢

转载自blog.csdn.net/weixin_39100915/article/details/80576481