Vue路由传参数方法

path匹配路由传参只能用query去接收参数，name来匹配路由只能用params去接收参数

方法一：用name传递参数

routes: [ { path: '/', name: 'Hello', component: Hello } ] 在相应路由里接收 :console.log(this.$route.name) // Hello

方法二：使用name来匹配路由，然后通过params来接收参数

基本语法：

<router-link :to="{name:xxx,params:{key:value}}">valueString</router-link> 示例：<router-link :to="{name:'Home',params:{username:'jspang',id:'555'}}"></router-link> 在相应路由里接收 :console.log(this.$route.params) // {username: "jspang", id: "555"}

方法三：使用path来匹配路由，然后通过query来接收参数 方法同：name来匹配路由传参

示例：<router-link :to="{path:'/Home',query:{username:'jspang',id:'555'}}"></router-link> 在相应路由里接收 :console.log(this.$route.query) // {username: "jspang", id: "555"}

方法四：利用url传递参数----在配置文件里以冒号的形式设置参数。

示例：{ path:'/params/:newsId/:newsTitle', component:Params } <router-link to="/params/198/jspang website is very good">params</router-link>

方法五：直接再跳转路径后面拼接参数

示例： <router-link to="/GoodsInfo?a=1"></router-link> 在相应路由里接收 :console.log(this.$route.query.a)