Vue传递参数不在URL路径上 显示参数的完整方法
首先,vue中传递参数 可以直接使用this.$router.push({path:'/taskCenter?id='+id+'paths='+path});但这样有一个明显的错误就是 会把参数显示在路由中。通过网上查阅资料 发现可以使用params 来传递参数 当发现这有一个大坑。下面 我来详细讲解 如何使用 params第一步:在vue中路由中这样 就是...
·
首先,vue中传递参数 可以直接使用
this.$router.push({path:'/taskCenter?id='+id});
但这样有一个明显的错误就是 会把参数显示在路由中。
通过网上查阅资料 发现可以使用 params 来传递参数 当发现这有一个大坑。下面 我来详细讲解 如何使用 params
第一步:
在vue中路由中这样 就是 src/router/index.js 路由中 一定要书写成下面这种格式
export default new Router({
routes: [
//发送的页面
{
path:'/workTask',
name:'workTask',
component: WorkTask
},
//接收参数的页面 注意这个name
{
path:'/taskCenter',
name:'taskCenter',
component: TaskCenter
}
]
})
第二步
在workTask页面中 写发送数据
this.$router.push({name:'taskCenter', params:{id: ids, savePath: savePath}})
注意 这个时候push中不在使用path,那是使用了你 要发送个哪个页面的 name值。在这里 我们需要发送个 taskCenter这个页面
第三步
在taskCenter这个页面中接收
mounted: function () {//可操作dom元素
this.$nextTick(function () {
//获取传递的参数
this.requestIds=this.$route.params.id;
this.requestXmlPath=this.$route.params.savePath;
})
}
至此你就可以获取你想要的 参数了
更多推荐
已为社区贡献6条内容
所有评论(0)