React context的Consumer包裹住Provider是什么意思？

Question

如下，是antd的drawer中的源码，代码中的DrawerContext的Consumer居然包裹住Provider，不都是Provider包裹Consumer的吗，该如何理解？//renderProviderforMulti-leveldrawerenderProvider=(value:Drawer)=>{let{zIndex,style,placement,className,wrapClassName,width,height,...rest}=this.props;warning(wrapClassName===undefined,'wrapClassNameisdeprecated,pleaseuseclassNameinstead.');consthaveMask=rest.mask?"":"no-mask";this.parentDrawer=value;constoffsetStyle:any={};if(placement==='left'||placement==='right'){offsetStyle.width=width;}else{offsetStyle.height=height;}return({this.renderBody()});}render(){return({this.renderProvider});}完整代码可以参考此处

Answer 1

eact-redux是官方提供的解决方案，Provider 本身并没有做很多事情，只是把 store放在 context 里。实际上如果你用react-redux，那么连接视图和数据层最好的办法是使用 connect 函数。本质上 Provider 就是给 connect 提供 store 用的。