Question

我收到以下警告

警告：setState（...）：只能更新已安装或已安装零件。这通常意味着您在已卸载时调用了setState（）零件。这是一个无操作。请检查未定义的代码成分

这是我的代码

var React = require('react');
import DetectUtil from 'pofod/detectUtil';
function withSubscription(WrappedComponent,MobileComponent) {
    class Subscription extends React.Component{
        constructor(props){
            super(props);
            this.state={
                ExternalComponent:innerWidth>1023?WrappedComponent:MobileComponent
            }
            this.getPageLangParams=this.getPageLangParams.bind(this);
            this.MonitorSize = this.MonitorSize.bind(this);
        }
        getPageLangParams () {
            var query=this.props.location?(this.props.location.query?this.props.location.query:{}):{};
            var lang=this.props.lang||query.lang||DetectUtil.languageFamily()||'zh';
            return lang;
        }
        MonitorSize(){
            this.setState({
                ExternalComponent:innerWidth>1023?WrappedComponent:MobileComponent
            })
        }
        componentDidMount(){
            window.addEventListener('resize',this.MonitorSize)
        }
        componentWillMount(){
            window.removeEventListener('resize',this.MonitorSize)
        }
        render(){
            let lang = this.getPageLangParams();
            let ExternalComponent = this.state.ExternalComponent;
            return (
                <ExternalComponent lang={lang}/>
            )
        }
    }
    return Subscription;
}

module.exports = withSubscription;

Answer 1

你混淆了componentWillMount和componentWillUnmount。

EventListener正在删除componentWillMount，但您应该在卸载之前将其删除，例如componentWillUnmount。

因此，当卸载组件时，MonitorSize会停止触发。这是应该如何：

componentWillUnmount(){
     window.removeEventListener('resize',this.MonitorSize)
}

只能更新已安装或安装的组件

1 个答案: