沒有爲新的setState（）設置狀態來註冊更改

我們正在構建一個非常複雜的React組件（內容編輯器）。每次調用activity組件componentDidMount()方法時，都會調用以下代碼，通常幾個方法幾乎立即在另一個之後。沒有爲新的setState（）設置狀態來註冊更改

addActivityToMap(activityObj){ 
    const { 
    activityMap 
    } = this.state; 
    const map = [ ...activityMap ]; 
    map.push(activityObj); 
    console.log(activityMap); 
    this.setState({ 
    activityMap: map 
    }); 
}

的問題是，在快速連續調用時，所述state.activityMap是未填充的，因爲每個activityObj被推到它，因此，當addActivityToMap執行週期是在state.activityMap陣列僅具有索引0最終activityObj。

所以控制檯日誌輸出與需要被推向activityMap看起來像

>[] 
>[]

我假設這是因爲州政府未能先下一完全更新兩個元素的處理數據集對象被推送。這非常煩人，因爲我無法控制這些對象生成的速度（它們來自於DraftJS實例中的自定義實體）。我在這裏有什麼選擇？

來源

2017-02-15 styke

有沒有辦法來鞏固多次調用到像'buildActivities'的包裝，其被調用一次，並返回最後的活動地圖數組被調用一次'setState'？ – Pineda

setState是異步的，這就是爲什麼你會遇到新狀態沒有新的activityMap的問題。你可以利用react的生命週期鉤子'shouldComponentUpdate'和'componentWillUpdate/componentDidUpdate'來檢查舊狀態的新狀態。 –

我通過將activityMap屬性直接附加到組件（'this'）並在addActivityToMap的末尾添加一個forceUpdate（）函數來解決問題。考慮到我無法控制這個函數被調用的頻率，並且無法連接到被調用的位置（自動生成的組件），我認爲這是最快最簡單的解決方案。 – styke

setState是異步的，但是您可以傳遞一個回調作爲第二個參數，一旦狀態被渲染就會被執行。 setState(nextState, callback)

這裏有回調的使用：https://facebook.github.io/react/docs/react-component.html#setstate

而更多的信息在這裏第二個實施setState：https://facebook.github.io/react/docs/state-and-lifecycle.html#state-updates-may-be-asynchronous

來源

2017-02-15 16:41:25

沒有爲新的setState（）設置狀態來註冊更改

回答

相關問題