vue怎么传变量参数给另一个页面_Vue:不同页面之间的传递参数--params

在嵌套vue-router情况下,不同页面之间传递参数可以通过params实现。而params传参分为两种情况:

1.参数在url中显示

首先你要确定自己要传的参数,并在控制路由的文件中的Router中path内添加对应的字段如:

{

path:'/paramsUrl/:name/:age/:sex',

component:paramsUrl

}

我要传的参数是姓名,年龄以及性别。

在你要跳转的组件内定义参数,如:

stu:{name:'Tom',age:18,sex:'male'}

同时在HTML中引入它们,通过router-link跳转(也可以通过点击事件,push()跳转),插入对应的字段。注意:如果参数个数不同,将不会出现预期效果!

goto paramsUrl

当然,你也可以通过this.$route.params.name来获取参数

2.通过name避免在url显示

通过上面的介绍,相信你也看出来相对应的弊端~不安全。如果用户篡改url中的参数,将会出现我们不想看到的问题。那么如何避免呢?---name

上边对Router中的操作只是改了 path,现在我们在添加一个name参数。

{

path: '/param',

name: 'param',

你可能感兴趣的:(vue怎么传变量参数给另一个页面_Vue:不同页面之间的传递参数--params)