vue 路由传参

1.通过 params 传递

const routes = [
  // 动态段以冒号开始
  { path: 'details/:id', name: "details", component: Details },
]

router.push() 方法的参数可以是一个字符串路径,或者一个描述地址的对象。

const Home = {
  template: '<div @click="toDetails">To Details</div>',
  metheds: {
    toDetails() {
      // 字符串路径
      this.$router.push('/details/001')
      // 带有路径的对象
      this.$router.push({path: '/details/001'})
      // 命名路由,路由配置时,需要 name 字段
      this.$router.push({ name: 'details', params: { id: '001' } })
    }
  }
}

2.通过 query 传递

1.this.$router.push('/details/001?kind=car')
2.this.$router.push({ path: '/details/001', query: { kind: "car" }})
3.this.$router.push({ name: 'details', params: { id: '001' }, query: { kind: 'car' }})

 

posted @ 2022-04-28 17:45  zwbsoft  阅读(25)  评论(0编辑  收藏  举报