在响应中将数据从父组件传递到提供者和使用者内部的子组件

Question

我有一个父级组件，必须在父级组件中使用广播。我想在此子组件中使用提供者和使用者传递数据。我想让子组件使用此提供程序和使用者在父组件中传递值。然后，我将使用此父级到子级组件的提供者和使用者来回调方法。

有人可以帮忙举例吗？我应该如何解决这个问题？我对React-redux很陌生。

代码如下：

import ReactDOM from "react-dom";
import "./styles.css";
import { createContext } from "react-broadcast";

// using CommonJS modules

const users = [{ name: "HITACHI" }, { name: "MGRM NET" }];

const { Provider, Consumer } = createContext(users[0]);

class UpdateBlocker extends React.Component {
  shouldComponentUpdate() {
    return false;
  }

  render() {
    return this.props.children;
  }
}

class App extends React.Component {
  state = {
    currentUser: Provider.defaultValue
  };

  componentDidMount() {
    setInterval(() => {
      const index = Math.floor(Math.random() * users.length);
      this.setState({ currentUser: users[index] });
    }, 2000);
  }

  render() {
    return (
      <div className="App">
        <Provider value={this.state.currentUser}>
          <UpdateBlocker>
            <Consumer>
              {currentUser => <p>The current user is {currentUser.name}</p>}
            </Consumer>
          </UpdateBlocker>
        </Provider>
      </div>
    );
  }
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);