初識Context
我們知道，在JS中context指的是函數(shù)的執(zhí)?上下?，函數(shù)被調(diào)?時，this指向誰，誰就是當(dāng)前的執(zhí)?上下?；
react中的context是什么呢？官??檔給出：
Context 通過組件樹提供了?個傳遞數(shù)據(jù)的?法，從?避免了在每?個層級?動的傳遞 props 屬性。
?檔也沒具體給出context到底是什么，?是告訴我們context能?什么，也就是說，如果我們不想通過props實現(xiàn)組件樹的逐層傳遞
數(shù)據(jù)，則可以使?context實現(xiàn)跨層級進(jìn)?數(shù)據(jù)傳遞！
如何使?Context
context api給出三個概念：React.createContext()、Provider、Consumer；
React.createContext()
這個?法?來創(chuàng)建context對象，并包含Provider、Consumer兩個組件 <Provider />、<Consumer />
const {Provider, Consumer} = React.createContext();
Provider
數(shù)據(jù)的?產(chǎn)者，通過value屬性接收存儲的公共狀態(tài)，來傳遞給?組件或后代組件
eg:
<Provider value={/* some value /}>
Consumer
數(shù)據(jù)的消費(fèi)者，通過訂閱Provider傳?的context的值，來實時更新當(dāng)前組件的狀態(tài)
eg:
<Consumer>
{value => / render something based on the context value */}
</Consumer>
值得?提的是每當(dāng)Provider的值發(fā)?改變時, 作為Provider后代的所有Consumers都會重新渲染
props單向數(shù)據(jù)流動：
如果覺得Props傳遞數(shù)據(jù)很繁瑣，可以采?context,進(jìn)?跨組件傳遞數(shù)據(jù)
再最外層的組件上，通過?產(chǎn)者Provider組件進(jìn)?包裹，并存儲共享數(shù)據(jù)到value中，當(dāng)然可以是任何數(shù)據(jù)類型。后帶需要?到共享數(shù)
據(jù)的組件均可通過Consumer進(jìn)?數(shù)據(jù)獲取。