router-link 动态传参

router-link动态传参

利用router-link动态传递参数，并打开新的页面进行展示
在router中添加

...
  {
      path: 'spaceDetail/:spaceId',
      name: 'spaceDetail',
      component: SpaceDetail,
      meta: {
        title: '地图服务详情',
        hidden: true,
        meta: {
          auth: false
        }
      }
    }
...

html中

<div v-for="item in resList" :key="item.id" class="box-res">
...
  <router-link :to="{name:'spaceDetail', params: {spaceId:item.id}}"  target="_blank">
        详细信息 >>
  </router-link>
...
</div>

target="_blank" 打开新页面

在新页面上获取参数

this.$route.params.spaceId