苦苦掙扎著繞過Redux？別擔心，你並不孤單。
我從許多人那裡聽說，Redux是編寫他們想要的React應用程序的最大障礙。
到本文結束時，您將了解Redux的用途，以及如何知道何時將其添加到您自己的應用程序中。
為什麼？
最好的問題是，我們為什麼要使用Redux？
答案並非“因為互聯網上的其他人都在使用它。”（我不懷疑這就是為什麼很多人都在使用它，但讓我們更深入。）
Redux有用的原因是它解決了一個問題。
不，它解決的問題不是“國家管理”。這是非常模糊的。哎呀，React已經做了國家管理。Redux確實幫助管理狀態，但這不是它解決的問題。
這是關於數據流
如果你使用React超過幾分鐘，你可能知道道具和單向數據流。數據傳遞下來通過道具組件樹。給定這樣的組件：
的count，存儲在App的狀態，將被傳遞下來的道具：
對於數據回來了樹，它需要通過一個回調函數來流動，使回調函數必須傳遞下來到想要傳遞數據的任何組件。
您可以將數據視為電力，通過彩色電線連接到關注它的組件。數據通過這些電線向下和向上流動，但電線不能通過稀薄空氣運行 – 它們必須連接在樹中的每個組件之間。
希望這是所有的評論。（如果沒有，你應該停在這裡，去學習React，構建幾個小應用程序，並在幾天后回來。說真的.Redux在理解React如何工作之前是沒有意義的。）。
數據流的圖層和圖層
遲早你會遇到頂級容器有一些數據的情況，而4級別的孩子需要這些數據。這是Twitter的截圖，所有頭像都突出顯示：
假設用戶的頭像存儲為其個人資料數據的一部分，頂級App組件保存用戶。為了將user數據傳遞給所有3個Avatar組件，user需要通過一堆不需要數據的中間組件來編織。
獲取數據就像在採礦探險中穿針一樣。等等沒有任何意義。無論如何，這是一個痛苦的屁股。
更重要的是，它不是很好的軟件設計。鏈中的中間組件必須接受並傳遞他們不關心的道具。這意味著重構和重用該鏈中的組件將比它需要的更難。
如果不需要數據的組件根本不需要查看它，那不是很好嗎？
將任何數據插入任何組件 這是Redux解決的問題。它使組件可以直接訪問所需的數據。
使用connectRedux附帶的功能，您可以將任何組件插入Redux的數據存儲，組件可以提取所需的數據。
這是Redux的存在理由。
是的，它也做了一些其他很酷的事情，比如簡化調試（Redux DevTools讓你檢查每一個狀態變化），時間旅行調試（你可以回滾狀態變化，看看你的應用程序在過去看起來如何），以及從長遠來看，它可以使您的代碼更易於維護。它還會教你更多關於函數式編程的知識。
但這裡的事情是“將任何數據插入任何組件”，這是主要事件。如果您不需要，您可能不需要Redux。
該Avatar組件 要將所有這些與代碼聯繫起來，以下Avatar是上面組件的示例：
import React from 'react';
import { connect } from 'react-redux';
const Avatar = ({ user }) => (
<img src="{user.avatar}/"></img>
);
const mapStateToProps = state => ({
user: state.user
});
export { Avatar };
export default connect(mapStateToProps)(Avatar);組件本身不知道Redux – 它只接受一個user道具並呈現頭像圖像。該mapStateToProps函數user從Redux的存儲中提取並將其映射到userprop。最後，該connect功能是實際通過飼料從終極版中的數據mapStateToProps和成Avatar。
你會注意到最後有兩個export- 一個是命名的，一個是默認的。這不是絕對必要的，但訪問原始組件及其 Redux包裝版本可能很有用。
原始組件在編寫單元測試時很有用，並且還可以提高可重用性。例如，應用程序的一部分可能要渲染Avatar的另一個比已登錄的用戶以外的用戶。在這種情況下，您甚至可以更進一步導出Redux連接版本，CurrentUserAvatar以使代碼更清晰。
何時添加Redux
如果你有一個像上面那樣的組件結構 – 其中props通過多層轉發 – 請考慮使用Redux。
如果需要在視圖之間緩存數據 – 例如，在用戶單擊詳細信息頁面時加載數據，並記住數據以便下次訪問速度很快 – 請考慮將數據存儲在Redux中。
如果你的應用程序很大，維護大量數據，相關而不是 – 考慮使用Redux。但是也可以考慮在沒有它的情況下啟動，並在遇到有用的情況時添加它。