React 上下文是一个在 React 组件之间共享数据的机制。它允许我们在组件树中传递数据，而不需要手动将 props 层层传递下去。然而，有时候我们可能会遇到一个问题，就是在使用 React 上下文时出现了返回未定义的情况。

jsx
const MyContext = React.createContext();

jsx
  {/* 子组件 */}

jsx
  {value => (
    // 使用上下文中的数据
  )}

jsx
const MyContext = React.createContext();
// 提供者组件
class MyProvider extends React.Component {
  state = {
    data: 'Hello, World!'
  };
  render() {
    return (
      
        {this.props.children}
      
    );
  }
}
// 消费者组件
class MyConsumer extends React.Component {
  render() {
    return (
      
        {value => (
          
{value}
        )}
      
    );
  }
}
// 应用组件
class App extends React.Component {
  render() {
    return (
      
        
使用 React 上下文
        
          
        
      
    );
  }
}
ReactDOM.render(, document.getElementById('root'));