組件已安裝，但我無法調用this.setState（...）或this.forceUpdate（...）;

我正在使用scrollable tab view和facebook官方助焊劑解決方案。在有些情況下，當一個場景保持無效（不是當前選中的標籤），並接收來自需要更新的場景商店的事件，但我有此錯誤： Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op.組件已安裝，但我無法調用this.setState（...）或this.forceUpdate（...）;

我仔細檢查過，並componentWillUnmount()是沒有被調用..但我收到這個警告，我不能再更新組件的狀態。

這裏我有這個問題未被選擇的選項卡是組件的一些示例代碼：

constructor(props) { 
    super(props); 

    this.state = { 
     isFavorite: this.isCurrentPostFavorite, 
     isMounted: false, 
     value: 0, 
    }; 

    this.updateStateForFavoriteModification = this.updateStateForFavoriteModification.bind(this); 
    } 

    componentDidMount() { 
    this.setState({isMounted: true}); 
    console.log('Article Scene did mount for article: '.toUpperCase() + this.props.sceneInfo.article.name); 
    HotelStore.bind(HotelEvent.didModifiedFavorite, this.updateStateForFavoriteModification.bind(this)); 
    } 

    componentWillUnmount() { 
    this.setState({isMounted: false}); 
    console.log('Article Scene will unmount for article: '.toUpperCase() + this.props.sceneInfo.article.name); 
    HotelStore.unbind(HotelEvent.didModifiedFavorite, this.updateStateForFavoriteModification); 
    } 

    changeFavoriteStatus() { 
    if (this.state.isFavorite) { 
     sendAction(HotelAction.removeFavorite, this.props.sceneInfo.article); 
    } 
    else { 
     sendAction(HotelAction.addFavorite, this.props.sceneInfo.article); 
    } 
    } 

    updateStateForFavoriteModification() { 
    console.log('Update: '.toUpperCase() + this.props.sceneInfo.article.name); 
    console.log('isMounted: '.toUpperCase() + this.state.isMounted); 

    // 
    // 
    // Here I Get the error 
    this.setState({isFavorite: this.isCurrentPostFavorite}); 
    } 

    get isCurrentPostFavorite() { 
    let matchNumber = HotelStore.favoritesPosts.filter((el: Post) => { 
     return el.translationId === this.props.sceneInfo.article.translationId; 
    }).length; 
    let isFavorite = matchNumber > 0; 
    console.log(isFavorite); 
    return isFavorite; 
    }

至於結果成分沒有安裝登錄console.log('Article Scene will unmount for article: '.toUpperCase() + this.props.sceneInfo.article.name);更新狀態之前從未顯示，也this.setState(...)在布爾之前isMounted在日誌中始終爲true。

編輯：我知道isMounted，這就是一個antipatern，我用這個只能在日誌檢查，如果組件被安裝或沒有，如果我刪除isMounted邏輯錯誤仍然存在。

來源

2017-01-13 Adrian Zghibarta

請提供相關的代碼示例 – mbernardeau

@mbernardeau done –

其中，所有'setState'，在控制檯中觸發該錯誤/警告？ – Chris

首先，你不應該想檢查你的組件是否安裝，it's an antipattern。

我想警告的出現是因爲你在componentWillUnmount中使用了setState。我認爲問題在於，setState是異步的，所以當您調用函數時，狀態可能不會立即更改。在這種情況下，它可能會嘗試更改組件已經卸載時的狀態。

來源

2017-01-13 14:18:38

我知道'isMounted'，這是一個antipatern，我只用它來檢查組件是否安裝，如果我刪除'isMounted'邏輯，錯誤仍然存在。 –

組件已安裝，但我無法調用this.setState（...）或this.forceUpdate（...）;

回答

相關問題