React Context Provider来源与命名规则？react-with-firebase-auth传值疑问

你遇到的传值机制是React高阶组件（HOC，Higher-Order Component），没有特殊命名约定，本质是组件封装的逻辑：

• 你引入的react-with-firebase-auth本身就是已经封装好的高阶组件，高阶组件是一类「接收组件为参数、返回增强后新组件」的函数。
• 你在App.js末尾导出的不是你手写的原始App组件，而是经过withFirebaseAuth处理后的增强组件：你写的withFirebaseAuth({providers, firebaseAppAuth})(App)逻辑是先传入firebase相关配置，再把你写的App组件作为参数传入，最终生成封装了完整firebase auth逻辑的新组件，index.js里渲染的就是这个增强后的组件。
• 增强组件内部已经实现了firebase auth状态监听、登录/登出方法封装的逻辑，它渲染你的原始App组件时，会自动把user、signOut、signInWithGoogle、error这些数据和方法以props的形式传递给原始App，你在App函数入参拿到的provider本质就是这个props，参数命名可以自定义，换成props也能正常运行：

// 改成这样效果完全一致
function App(props){
  return (
    <div className="App">
        {
          props.user 
          ? <AppContainer 
                authUser={props.user}
                signOut={props.signOut}
              />
            : <SignInPage 
              signInWithGoogle={props.signInWithGoogle}
              error={props.error}
              />
        }
    </div>
  );
}

• 整个流程不需要你手动传值，所有auth相关的数据传递逻辑都在withFirebaseAuth内部完成，你只需要直接使用传入的props即可。

内容的提问来源于stack exchange，提问作者fotoflo