返回上一页时，保存恢复浏览记录（模拟返回不刷新）

import Vue from ‘vue‘

export default {
    install(Vue, options) {
        Vue.prototype.SEstorage = {
            page_type: window.location.hash.split(‘?‘)[0],
            container: window.sessionStorage,
            savePage: function(page) {
                let cur_page = parseInt(page) || 1;
                this.container.setItem(`${this.page_type}_page`, cur_page);
            },
            saveScroll: function() {
                var cur_scroll = document.body.scrollTop;
                this.container.setItem(`${this.page_type}_scroll_top`, cur_scroll);
            },
            saveBackInfo: function(page) {
                this.savePage(page);
                this.saveScroll();
            },
            isBack: function() {
                let cur_page = this.container.getItem(`${this.page_type}_page`);
                let cur_scroll = this.container.getItem(`${this.page_type}_scroll_top`);
                if (cur_page) {
                    this.container.removeItem(`${this.page_type}_page`);
                    this.container.removeItem(`${this.page_type}_scroll_top`);
                    return {
                        page: parseInt(cur_page),
                        scroll_top: parseInt(cur_scroll),
                    };
                } else {
                    return {};
                }
            },
        }
    }
}

export default {
    data() {
        return {
            list: [],
            page: 1,
            history: {}, //保存的记录
        }
    },
    created() {
        this.history = this.SEstorage.isBack();    //获取到记录
        this.page = this.history.page || this.page;    //修改page
        this.getList();    //获取数据
    },
    methods: {
        getList() {
            this.axios.get(`${this.APIURL}?page=${this.page}`).then(resp => {
                this.list = resp.data.data;
                // 恢复滚轮保存的位置，这里dom渲染是个一部的过程，所以写在nextTick的回调里面
                if (this.history.page) {
                    this.$nextTick(() => document.body.scrollTop = this.history.scroll_top);
                }
            });
        },
        // 跳转到内容页面时，保存阅读记录
        toAudioList(_id) {
            this.SEstorage.saveBackInfo(this.page);
            this.$router.push({ path: ‘./next_page‘, query: { _id: _id } });
        },
    }
}