將新陣列合併到componentWillReceiveProps狀態

Question

我試圖做一個無限的滾動邏輯，我在componentWillReceiveProps中這樣做，但沒有看到我的列表正確渲染？

componentWillReceiveProps(nextProps) { 
    if(!isEqual(nextProps.listItems, this.state.listItems)){ //user scrolled, call next offset using the API 
     this.setState({ 
      listItems: this.state.listItems.push(...nextProps.listItems) 
     }) 
    } 
} 

Answer 1

將當前listItems和下一組listItems擴展到新數組中以避免變異狀態。

componentWillReceiveProps(nextProps) { 
 
    if(!isEqual(nextProps.listItems, this.state.listItems)){ //user scrolled, call next offset using the API 
 
     this.setState({ 
 
      listItems: [...this.state.listItems, ...nextProps.listItems] 
 
     }) 
 
    } 
 
}