Vue页面跳转传递参数及接收

这里给大家推荐一款免费迭代 二开便捷的商城项目：源码直通车>>> 最近接触了vue项目，这里记录一下vue跳转到下一页面携带参数的两种方式。

典型应用场景：列表页跳转到详情页

一、配置路由

文件路径：src/router/config.php

import Vue from 'vue' import Router from 'vue-router'

import classify from '.././components/classify/classify.vue'

import classifyChild from '.././components/classify/classifyChild.vue'

export default new Router({ mode: 'history', routes: [ { path: '/classify', name: ' classify', component: classify }, { path: '/classify/classifyChild', name: 'classifyChild', component: classifyChild },

] })

二、页面跳转及传参

//方式一 跳转

//方式二 跳转 三、参数接收

//对应于方式一 let id=this.$route.params.id;

//对应于方式二 let id=this.$route.query.id;