2

我是新手,但我没有在网上找到我的问题的答案,我相信我误解了很多东西。

看看这段代码

function App() {
  const classes = useStyles()
  const [menuOpen, setMenuOpen] = useState(false)

  return (
    <ThemeProvider theme={main}>
      <Router>
        <CssBaseline />
        <TopBar onMenuButton={() => setMenuOpen(!menuOpen)} />
        <AppMenu open={menuOpen} />
        <main className={classes.content}>
          <div className={classes.toolbar} />
          <Grid container justify="center" spacing={2}>
            <Grid item xs={menuOpen ? 10 : 12}>
              <Routes />
            </Grid>
          </Grid>
        </main>
      </Router>
    </ThemeProvider>
  )
}

export default App


在顶部我们调用useState钩子,它返回两个值:一个变量和一个更新变量的函数。当setMenuOpen被调用时,组件被重新渲染。当一个组件被重新渲染时,整个App函数被再次调用一次,并且useState在最顶部被再次调用一次。 问题是:当我们第二次到达这个地方时,

如何useState知道传递给函数的新值?setMenuItem所以现在,menuOpen等于我们作为参数传递给setMenuItem函数的值。

const [menuOpen, setMenuOpen] = useState(false)

我相信它将它存储在某种注册表或组件的不同渲染之间的全局变量中。
提前致谢。

4

0 回答 0