vue带参数跳转其他页面

1.准备好两个vue文件

panda.vue
travel.vue

2.写index.js配置文件

import travel from '@/components/travel'

    {
   
   
      path: '/travel/:id',
      name: '测试页面',
      component: travel
    }

3.编写跳转前的页面

这是一个点击事件

      gettravel(id) {
   
   
        this.$router.push({
   
   
          path: '/travel/' + id,
        })
      }
    },

这里触发事件，并且传递参数

<span @click="gettravel(item.spotsid)">
                    <h1>点击tiaoz</h1>
                    </span>

4，编写跳转后的页面接收参数

<div>{
   
   {
   
   this.$route.params.id}}</div>

来源：oschina

链接：https://my.oschina.net/u/4399909/blog/4694277