vue2.0 动态路由传参方法
来源:互联网 发布:网络社交的利与弊论点 编辑:程序博客网 时间:2024/06/06 11:43
因为是用element-ui渲染出来的tree菜单,
每个节点完成路由只能使用编程式导航(在函数里触发路由)
并传参需要组件需要获取的数据
使用this.$router.push()
this.$router.push({name: '你路由的名字', query: {id: '可以是变量'}})
获取的方法为
this.$route.query.id
文档中提到
提醒一下,当使用路由参数时,例如从 /user/foo 导航到 user/bar,原来的组件实例会被复用。因为两个路由都渲染同个组件,比起销毁再创建,复用则显得更加高效。不过,这也意味着组件的生命周期钩子不会再被调用。复用组件时,想对路由参数的变化作出响应的话,你可以简单地 watch(监测变化) $route 对象:
watch: { '$route' (to, from) { // 对路由变化作出响应... } }也就是说当你把参数绑定到节点里后
<p>{{params}}</p>data () { return { params: this.$route.query.id } }当参数发生变化时,你需要watch: { '$route' (to, from) { this.params = this.$route.query.id } }不然p标签里的值不会发生改变
阅读全文
0 0
- vue2.0 动态路由传参方法
- Vue2.0路由动态路径的绑定
- vue2.0 路由 学习笔记
- vue2.0——路由
- vue2.0路由--vue-router
- vue2.0路由的配置
- vue2.0 点击跳转传参--vue路由跳转传参数
- Vue2 路由
- vue动态路由匹配,路由传参
- vue2.0 路由不显示router-view
- vue2.0路由及兄弟组件通信
- 【Vue】2.vue2.0路由及路由嵌套
- vue2中(路由/父子/组件/事件)数据通信方法总结
- vue2 router 动态传参,多个参数
- vue2 router 动态传参,多个参数
- Vue2路由问题汇总
- 静态路由 | 动态路由 | 默认路由的配置方法
- vue2导航根据路由传值,而改变导航内容
- Python练习2-随机数产生
- android中的BroadcastReceiver简单用法
- struts2 环境配置 (1)
- 根据underscore精简的函数(数组篇)
- Android中ScrollView和ListView嵌套使用时,进入界面不是从起始位置也即是不是从顶部显示问题
- vue2.0 动态路由传参方法
- spring boot 发送邮件
- 学习Javascript闭包(Closure),从外部读取局部变量
- 如何给SNMP Trap通道加上同步机制
- Bootstrap学习之四:表单
- maven 找不到符号 或者总是报编译错误
- 动态范围规划(调整)Dynamic Range Control的一些心得(一)
- U-Box of Bricks
- cocoapods安装以及使用(图文详解)