react.js - react CSSTransitionGroup 在页面切换时不会将state重置

问题描述

问 题

单页应用。页面之间切换
<CSSTransitionGroup

            component="div"
            transitionName="main"
            transitionEnterTimeout={500}
            transitionLeaveTimeout={500}
        >
            <div className="position" key={ this.props.location.pathname}>{this.props.children}</div>
        </CSSTransitionGroup>

在滚动加载更多时设置isLoadingMore为true时。当ajax加载未完成切换页面。isLoadingMore不会改为false.导致其它下拉加载页面失败。如何处理

   loadMore() {
    let self=this;       
    const page = this.state.page + 1;//获取当前加载页数
    const {total}=this.props;
    if (page <= total) {
        this.setState({
            isLoadingMore: true
        });
        let arg = "labelId=" + this.state.labelId + "&pageNum=" + page;
        this.props.indexAction.LoadMore(API.gethomepage, arg).then(() => {
            self.setState({
                isLoadingMore: false,
                page: page
            });
        })

    }else{
        this.setState({
            isLoadingMore:true,
            loadingEnd:true
        })
    }

}

解决方案

我已解决了。使用props的方式来处理

这篇关于react.js - react CSSTransitionGroup 在页面切换时不会将state重置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！