Реактивные Крючки. Родительский компонент не рендерится для выполнения условного оператора

Question

Я пытаюсь повторно обработать приложения. js для чтения обновленного условного оператора из компонента Start. js в div. В настоящее время у меня есть шаблон глобального управления состоянием, и поэтому, когда я go нажимаю кнопку в компоненте «Пуск», приложение не запускает приложение. js для повторного рендеринга. Приложение. js

import { GlobalContext } from "./context/GlobalState";
import Start from "./components/start";
import "./App.css";
import { GlobalProvider } from "./context/GlobalState";

function App() {
  const {
    showStartPage,
    test,
    tester
    // header,
    // showGroup,
    // currentQuestion,
    // direction,
    // handleNextQuestion,
    // handlePreviousQuestion,
    // completion,
  } = useContext(GlobalContext);

  const [show, setShow] = useState(showStartPage);
  // let showPage = false

  useEffect(() => {
    // setShow(showStartPage)
    //
    // return showStartPage => {};
    //   tester();

    setShow(showStartPage);
    if (!showStartPage) {
      window.location.reload();
    }
    //   // const survey = showStartPage ? <Start /> : null;
    console.log("from APP.js", show);
  }, [showStartPage, show]);

  return (
    <GlobalProvider>
      {showStartPage ? (
        <Start />
      ) : (
        <>
          <div>Survey Questions will Go Here {test}</div>
        </>
      )}
    </GlobalProvider>
  );
}

export default App.js```

Answer 1

Вы должны обернуть свой App компонент GlobalProvider в index.js, а не в App.js

ReactDOM.render(<GlobalProvider><App /></GlobalProvider>, document.getElementById("root"));

Обновление значений контекста приведет к повторной визуализации только тех компонентов, которые отображается в провайдере контекста.