zoukankan      html  css  js  c++  java
  • react中界面跳转 A界面跳B界面,返回A界面,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'));
            }
    
           
        }
  • 相关阅读:
    删除排列数组中的重复数字
    关于删除数组中重复元素的lintcode代码
    软件工程---删除重复数组
    软件工程实验一实验报告
    软件工程test1-Q2【买卖股票的最佳时机】
    软件工程test1-Q1【删除排序数组中的重复数字】
    接口响应状态码
    TestNG教程
    HttpClient-4.5.2官方教程完整翻译
    cookie、session与token的关系
  • 原文地址:https://www.cnblogs.com/weiweiyeyu/p/13433065.html
Copyright © 2011-2022 走看看