关于vue,$router的页面间传值

Question

问题描述

萌新一枚，现在练习VUE嘛，就碰到了关于页面间传值的问题，用的是通过$router来传递的办法

举个栗子

A页面 传递
this.$router.push({path:'/adminManage',query:{usn:result.data}})

B页面获取（用的搜来的方法）
贴链接
https://blog.csdn.net/hanxion...

created:function(){ 
    this.getParams();
},
watch: { 
// 监测路由变化,只要变化了就调用获取路由参数方法将数据存储本组件即可
      '$route': 'getParams'
},
methods:{ 
    getParams:function(){ // 取到路由带过来的参数
        var routerParams = this.$route.query.nameId // 将数据放在当前组件的数据内
    console.log("传来的参数=="+routerParams) 
    this.textareText = routerParams 
    },
}

后来自己尝试直接在B页面data里赋值

data(){
        return{
            role:this.$route.query.usn.role
        }
    },

发现不用监听也可以，但是本着大佬的方法多半还是比自己好的这个想法，想问问大家：我这种做法有什么不好的地方

厚脸皮一下

请大佬们指教下关于页面传值$router，eventBus以及Storage三种方式适用于什么场景

Answer 1

确实不需要监听，因为路由只会变化一次。
eventBus适用于比较简单的场景，存放一些全局的方法和对象等，Storage分两种啦，sessionStorage, localStorage，用于浏览器存储的。
至于页面之间的传值还是用 $router 对象比较好。

Answer 2

$router适用页面间的传值，例如详情页面等的传值；
eventBus是适用同级间的传值，例如两个同级模块；
Storage适用全局传值，一般是作为缓存使用，既可以适用于页面间，也可以适用同级，不过缺点是缓存的数据占据资源

Answer 3

1、本来就不需要监听，就可以获取到路由传递的值
2、$router适合传递一些简单的与状态无关的值
3、eventBus是做完某件事情的时候要告诉某个人的时候才用的
4、Storage，需要持久化的数据、多个页面用到的数据、数据比较大