ReactJS獲取道具上的新數據

作爲前言，我還是React的新手，所以我仍然摸索着通過事物的方式。ReactJS獲取道具上的新數據

我所擁有的是提取數據以呈現HTML表格的組件。因此，我在componentWillMount()之內調用了我的Actions'fetchData()（它使用瀏覽器的fetch() API），該應用程序還具有Store更改的偵聽器。這一切運作良好，我能夠檢索和呈現數據。

現在下一步。我希望能夠在組件的道具更新時獲取新數據。但我不確定這樣做的正確方法是什麼。所以，我有三個部分問題

會適當的地方做我的fetchData()新道具在componentWillReceiveProps()，驗證該道具的確發生了變化，當然後？
我的API速度非常慢，所以完全有可能在抓取仍在運行時出現一個新的道具。是否有可能取消舊的提取並啓動一個新的提取，或者至少實現邏輯來忽略原始結果並等待來自較新提取的結果？
與上述問題相關，有沒有一種方法可以確保除了像我的Action的狀態（或其他地方）中的isLoading布爾值之外，在任何時候只有一個獲取正在運行？

來源

2016-08-27 accelerate

[This]（https://stackoverflow.com/questions/31723095/how-to-wait-for-ajax-response-and-only-after-that-render-the-component）看起來有關。 – Igorsvee

是的，componentWillReceiveProps是適當的地方做到這一點。

關於點2和3：

取消任務和維護「一取指運行」的想法似乎是不夠的。我不認爲應該在任何系統中使用這種解決方案，因爲實施會通過設計限制您的應用的效率。

是否有可能取消舊獲取和啓動一個新的，或者至少實現邏輯忽略原有結果，並等待結果從較新的取？

爲什麼不讓'新的獲取'響應覆蓋'舊獲取'響應？

如果你真的想避免顯示舊的響應，你可以簡單地使用一個所有fetchData調用的計數器來實現它。您可以通過這種方式實現：

var ApiClient = { 
    processing: 0, 
    fetchData: function(){ 
     processing++ 
     return yourLibForHTTPCall.get('http://endpoint').then(function (response)){ 
      processing-- 
      return response 
     } 
    }, 
    isIdle: function(){ 
     return processing == 0 
    } 
}

，並在那裏你居然撥打電話的地方：

apiClient.fetchData(function(response){ 
    if(apiClient.isIdle()){ 
     this.setState({ 
     }) 
    } 
}

我希望yourLibForHTTPCall.get返回的情況下Promise。

來源

2016-08-27 13:58:36 mklimek

ReactJS獲取道具上的新數據

回答

相關問題