陣營JS - 一個事件監聽

Question

我試圖更新EventListener的在我的組件的狀態中更新狀態。我得到以下控制檯錯誤：

「警告：的setState（...）：只能更新一安裝或安裝組件。這通常意味着您在卸載的組件上調用了setState（）。這是一個沒有操作。請檢查該頭組件」

代碼這是我的部分代碼：

class Header extends React.Component { 
    constructor(props) { 
     super(props); 

     this.state = { 
      fixed: false 
     } 
    } 

    handleScroll(event) {  
     this.setState({ 
      fixed: true 
     }); 
    } 

    componentDidMount() { 
     window.addEventListener("scroll",() => {    
      this.handleScroll();  
     });  
    }  
    componentWillUnmount() { 
     window.removeEventListener("scroll",() => {    
      this.handleScroll();  
     }); 
    } 


    render() { 
     var { 
      dispatch, 
      className = "", 
      headerTitle = "Default Header Title", 
      onReturn, 
      onContinue 
     } = this.props; 

     var renderLeftItem =() => { 
      if (typeof onReturn === 'function') { 
       return (
        <MenuBarItem icon="navigation-back" onClick={onReturn}/> 
       ) 
      } 
     }; 

     var renderRightItem =() => { 
       if (typeof onContinue === 'function') { 
        return (
         <MenuBarItem icon="navigation-check" onClick= {onContinue}/> 
       ) 
       } 
     }; 

     return (
      <div className={"header " + className + this.state.fixed}> 
        {renderLeftItem()} 
        <div className="header-title">{headerTitle}</div> 
         {renderRightItem()} 
        </div> 
     ) 
    } 

} 


Header.propTypes = { 

}; 

let mapStateToProps = (state, ownProps) => { 
    return {}; 
}; 

export default connect(mapStateToProps)(Header); 

Answer 1

恕我直言，這是因爲你，你期望它做ONT註銷功能，之後被送到滾動事件此組件的實例已卸載

試試這個：

componentDidMount() { 
    this._handleScroll = this.handleScroll.bind(this) 
    window.addEventListener("scroll", this._handleScroll);  
}  
componentWillUnmount() { 
    window.removeEventListener("scroll", this._handleScroll); 
}