Question

我想在我的上下文中使用反应状态。看起来像这样：

export const App = () => {
  const [value, setValue] = useState("test");
  return (
    <BrowserRouter>
      <Switch>
        <ViewContext.Provider value={{value, setValue}}>
          <Route path="/" render={(props) => <AdminLayout {...props} />} />
          <Route
            path="/Dashboard"
            render={(props) => <AdminLayout {...props} />}
          />
        </ViewContext.Provider>
      </Switch>
    </BrowserRouter>
  );
}

export default App;

我所有的出口都在那里。然后我在索引中这样调用：

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

如果我将上下文与例如value =“ Test”一起使用，这确实有效，但是当我尝试将其与状态一起使用时，它将无法正常工作。有什么想法吗？

Answer 1

export const App = () => {
  const [value, setValue] = useState("test");
  return (
    <BrowserRouter>
      <Switch>
        <ViewContext.Provider value={value}> <----- you have to use like this
          <Route path="/" render={(props) => <AdminLayout {...props} />} />
          <Route
            path="/Dashboard"
            render={(props) => <AdminLayout {...props} />}
          />
        </ViewContext.Provider>
      </Switch>
    </BrowserRouter>
  );
}

export default App;

使用useState和上下文

1 个答案: