VUE 不同页面传递数据

场景描述

目前存在两个页面，A和B，要将对象C从A传递到B中。

使用技术

SESSION_KEY_NOTICE = "SESSION_KEY_NOTICE";
SESSION_KEY_NOTICE_SEND = "SESSION_KEY_NOTICE_SEND";
//封装了 H5自带的storage,会话缓存
SessionStorage = {
    get: function (key) {
        let v = sessionStorage.getItem(key);
        if (v && typeof(v) !== "undefined" && v !== "undefined"){
            return JSON.parse(v);
        }
    },
    set: function (key,data) {
        sessionStorage.setItem(key,JSON.stringify(data));
    },
    remove: function (key) {
        sessionStorage.removeItem(key);
    },
    clearAll: function () {
        sessionStorage.clear();
    }
};

SessionStorage 中 key 建议为常量，因为随着项目中缓存用的越来越多，key名有可能冲突，要修改的话 设计到 调用出、及get 和 set 中。常量不要用单一的单词，最好加一些前后缀。

···
SESSION_KEY_NOTICE = “SESSION_KEY_NOTICE”;
SESSION_KEY_NOTICE_SEND = “SESSION_KEY_NOTICE_SEND”;
//封装了 H5自带的storage，本地缓存，关闭浏览器 下次打开还存在
SessionStorage = {
get: function (key) {
let v = localStorage.getItem(key);
if (v && typeof(v) !== “undefined” && v !== “undefined”){
return JSON.parse(v);
}
},
set: function (key,data) {
localStorage.setItem(key,JSON.stringify(data));
},
remove: function (key) {
localStorage.removeItem(key);
},
clearAll: function () {
localStorage.clear();
}
};
···

使用方法

A 页面 中

                SessionStorage.set(SESSION_KEY_NOTICE,c);
                _this.$router.push('/b');

B 页面 中

        mounted() {
            let c= SessionStorage.get(SESSION_KEY_NOTICE) || {};
        }