DEV Community

Discussion on: The React Context hell

Collapse
reedbarger profile image
Reed Barger
// src/components/AppProviders.js

export default function AppProviders({ children }) {
  return (
    <Context1 value={value}>
      <Context2 value={value2}>
        <Context3 value={value3}>{children}</Context3>
      </Context2>
    </Context1>
  );
}
Enter fullscreen mode Exit fullscreen mode
// src/index.js

import ReactDOM from "react-dom";
import App from "./App";
import AppProviders from './components/AppProviders'

const rootElement = document.getElementById("root");
ReactDOM.render(
  <AppProviders>
    <App />
  </AppProviders>,
  rootElement
);
Enter fullscreen mode Exit fullscreen mode
Collapse
acro5piano profile image
Kay Gosho

Agree.

Collapse
727021 profile image
Andrew Schimelpfening

This looks way cleaner IMO. Keep it simple and easy to read.

Collapse
stereoplegic profile image
Mike Bybee

Exactly. No point digging into internals when you can just import.