react中界面跳轉 A界面跳B界面，返回A界面，A界面狀態保持不變 localStorage方法

好像所有的單頁面應用都會有個問題，就是我A作為一級界面，跳轉到二級界面B的時候，在回到A界面，你會發現所有的參數都重新加載了

很多時候假如我們的界面有很多條新聞列表，通過設置參數篩選出了一部分的新聞列表，這個時候我點擊新聞標題進入了新聞詳情，然后返回

到A界面的時候，發現所有的條件都重置了，這樣用戶體驗很顯然是非常不好的。

我還是個小菜鳥所以對於那種大佬們說可以使用redux可以實現的方法不是很明白，所以我就介紹下另外一種方法

在跳轉到B界面的時候，把你想要保留的數據啊參數啊，傳遞給B界面，在B界面里面使用localStorage進行保存，然后回到A界面的時候，可以判斷下localStorage是不是存在，存在直接使用該數據該參數，否則就按原有的來。

A界面

componentDidMount() {
        backTop();
        let localTemp = JSON.parse(localStorage.getItem('hotTemp'));

        if (localTemp === undefined || localTemp === null) { //這邊是判斷是不是從B回來的，如果不是，就初始化請求
            let params = {
                page: 1,
                size: 20
            }
            this.getHotEvent(params);
        } else {  //如果是從B回來的，那么就把條件啊，數據啊，直接給state進行顯示就可以了
            this.setState({
                pageNum: localTemp.pageNum,
                hotEvent:localTemp.hotEvent,
                success:localTemp.success,
                total:localTemp.total
            })
            if (localTemp.sflag) { //我這邊是做了個是不是填寫了篩選條件的判斷   如果填寫了篩選條件回到A界面的時候，這些篩選條件要顯示出來
                this.setState({
                    defaultInput: localTemp.defaultInput,
                    startTime: localTemp.startTime,
                    endTime: localTemp.endTime,

                })
                //this.getIeahotsSearch(localTemp.searchParam);
            } else { //這邊是沒有任何篩選條件，只要數據顯示就可以了

                //this.getHotEvent(localTemp.params);
            }
        }

    }



<Link className="recall left transition3"
to={{
     pathname: "/B",
      state: {eventArray: item, localState: this.state},  //這邊是我想要保留的數據，通過state傳給B 
}}
>{item.title}</Link>

B界面

  componentDidMount() {
     
       /*保存A界面列表的參數*/
        if(this.props.location.state.localState!==undefined&&this.props.location.state.localState!==null){
            localStorage.setItem("hotTemp", JSON.stringify(this.props.location.state.localState));
            //console.log(localStorage.getItem('hotTemp'));
        }

       
    }

這樣就可以了

注：一定要在其他的界面清除這個localStorage