對react的context的研究

2022-06-23 19:45:15 字數 2422 閱讀 6011

context被翻譯為上下文,在程式設計領域,這是一個經常會接觸到的概念,react中也有。

在react的官方文件中,context

不過,這並非意味著我們不需要關注context。事實上,很多優秀的react元件都通過context來完成自己的功能,比如react-redux的,就是通過context提供一個全域性態的store,拖拽元件react-dnd,通過context在元件中分發dom的drag和drop事件,路由元件react-router通過context管理路由狀態等等。在react元件開發中,如果用好context,可以讓你的元件變得強大,而且靈活。

簡單說就是,當你不想在元件樹中通過逐層傳遞props或者state的方式來傳遞資料時,可以使用context來實現跨層級的元件資料傳遞。

使用context,可以跨越元件進行資料傳遞。

對於父元件,也就是context生產者,需要通過一個靜態屬性childcontexttypes宣告提供給子元件的context物件的屬性,並實現一個例項getchildcontext方法,返回一個代表context的純物件 (plain object) 。

而對於context的消費者,通過如下方式訪問父元件提供的context

子元件需要通過一個靜態屬性contexttypes宣告後,才能訪問父元件context物件的屬性,否則,即使屬性名沒寫錯,拿到的物件也是undefined

對於無狀態子元件(stateless component),可以通過如下方式訪問父元件的context

通過靜態方法react.createcontext()建立一個context物件,這個context物件包含兩個元件,

實際上,除了例項的context屬性(this.context),react元件還有很多個地方可以直接訪問父元件提供的context。比如構造方法:

比如生命週期:

對於面向函式的無狀態元件,可以通過函式的引數直接訪問元件的context

const statelesscomponent = (props, context) => (

......

)

通過context暴露資料或者api不是一種優雅的實踐方案,儘管react-redux是這麼幹的。因此需要一種機制,或者說約束,去降低不必要的影響。

通過childcontexttypescontexttypes這兩個靜態屬性的約束,可以在一定程度保障,只有元件自身,或者是與元件相關的其他子元件才可以隨心所欲的訪問context的屬性,無論是資料還是函式。因為只有元件自身或者相關的子元件可以清楚它能訪問context哪些屬性,而相對於那些與元件無關的其他元件,無論是內部或者外部的 ,由於不清楚父元件鏈上各父元件的childcontexttypes“宣告”了哪些context屬性,所以沒法通過contexttypes“申請”相關的屬性。所以我理解為,給元件的作用域context“帶許可權”,可以在一定程度上確保context的可控性和影響範圍。

在開發元件過程中,我們應該時刻關注這一點,不要隨意的使用context

export function createprovider(storekey = 'store', subkey) subscription`

class provider extends component

}constructor(props, context)

render()

}// ......

provider.proptypes =

provider.childcontexttypes =

return provider

}export default createprovider()

元件級的資料共享

新版 react context的寫法

祖元件 import react from react import cnode from components cnode type pr...

Thread的context模式

public class mycontext public static contextsession getmysession public static void put myhttprequest req public static vantagesearchrequest get publi...

http隧道的研究

1 reduh為什麼要bind一個udp,如何維持tcp的? 似乎只要不close,就不會關閉開啟過的socket 2 如果web超時,或者指令碼超時,是否意味著會斷開連線。 似乎並不會 3 是否針對可對長連線特性進行優化。 中已經通過urllib3的連線池,進行長連線維持 理論上,可以傳送少量資料精...