React中如何「加載更多」？

前提條件：

1. 假設首頁文章列表放於 store 的 list 中。

---

思考步驟：

1. 經過 styled-components 建立「加載更多」按鈕組件，並綁定click回調函數A。
2. 理想狀態 函數A 經過 dispatch 出一個 action 異步獲取數據並更新 store 中的 list 數據，組件再從新循環輸出 list。
3. 首要問題 通信 ，要讓首頁文章模塊和 store 通信咱們須要使用到 react-redux （經過提供的 Provider 標籤中的 store 屬性接收到store，經過 connect 函數打通模塊和傳入的 store 間的通信。）
4. 其次 獲取數據，使用 axios 異步獲取數據相對簡單可是這部分代碼寫在哪最合適？？由於要 dispatch 因此首先想到 mapDispatchToState ，但咱們不是直接 dispatch 而是先獲取異步數據，因此須要中間人介入也就是 中間件 使用 redux-thunk 能夠 dispatch 函數，而函數中就能夠異步獲取數據並 dispatch 出攜帶了異步返回數據的 action。