保留应用程序的状态，超越页面刷新

Question

目前，App组件已启动异步加载。

App组件是容器：

import React, {Component} from 'react';
import BrowserRouter from "react-router-dom/es/BrowserRouter";
import Switch from "react-router-dom/es/Switch";
import Route from "react-router-dom/es/Route";
import Redirect from "react-router-dom/es/Redirect";
import ScenePage from "../ScenePage/index";
import CoverPage from "../CoverPage/index";
import {INDEX, SCENE_PAGE} from "../../constantRoutes";
import JSONHeader from "../../newModel14Junio/JSONHeader";

export default class App extends Component {
    constructor(props) {
        super(props);

        const finishCallback = () => {
            this.setState({isAtlasLoading: false});
        };


        const header = new JSONHeader('/atlas/json/', finishCallback);

        this.state = {
            isAtlasLoading: true
        };
    }

    render() {
        if (this.state.isAtlasLoading) {
            return (<div>Atlas loading</div>);
        }
        return (
            <BrowserRouter>
                <div>
                    <Switch>
                        <Route exact path={INDEX} component={() => <CoverPage IndexAtlas={window.IndexAtlas}/>}/>
                        <Route path={SCENE_PAGE} component={() => <ScenePage IndexAtlas={window.IndexAtlas}/>}/>
                        <Redirect from="*" to={INDEX}/>
                    </Switch>
                </div>
            </BrowserRouter>
        );
    }
}

异步请求由JSONHeader完成：

import jQuery from 'jquery-ajax';
import Atlas from "./Atlas";

export default class JSONHeader {
    constructor(location, callback) {
        loadAtlasStructure(location, callback);

        function loadAtlasStructure(location, callback) {
            jQuery.ajax({
                dataType: "json",
                url: location,
                async: true,
                success: function (files) {
                    files.map((file) => {
                        jQuery.ajax({
                            dataType: "json",
                            url: location + file,
                            async: true,
                            success: function (data) {
                                console.log(data);
                                if (!window.IndexAtlas) {
                                    window.IndexAtlas = new Atlas();
                                }
                                window.IndexAtlas.addSubAtlas(data);
                                console.log('JSONHeader::window.IndexAtlas', window.IndexAtlas);
                                callback(window.IndexAtlas);
                            }
                        });
                    })
                }
            })
        }
    }
}

如果只进行一次异步加载然后重复使用其内容，可能会更好。但是，目前在每个导航或页面刷新时，所有图集都将被重新加载。我知道App正在重新创建，因为它在ReactDom.render（）中。我们怎样才能在页面重新加载之间重用它的状态???