【问题标题】:Updating Global Variable / State in React在 React 中更新全局变量/状态
【发布时间】:2019-11-06 07:24:07
【问题描述】:

对 React 还是很陌生,并且一直在做一个项目。我一直需要将此计数器作为全局变量进行跟踪,并在组件内更新其值。我已经使用 setState hook const [currentMaxRow, setRow] = useState(3) 声明了这个计数器,我想在它被传递到的组件中更新这个值。不知道该怎么做,谢谢!

【问题讨论】:

标签: javascript reactjs typescript


【解决方案1】:

使用钩子的示例应用程序

-将值和函数传递给子组件。

 function App() {
  const [currentMaxRow, setRow] = React.useState(3)  

  const incrementVal = () => {
    setRow(currentMaxRow + 1);
  };
  return (
    <div>
      <p>You clicked {currentMaxRow} times</p>
      <Child count={currentMaxRow} incrementVal={incrementVal} />
    </div>
  );
}
const Child = props => (
  <>
    <button onClick={props.incrementVal}>Click me</button>
    <h3>{props.count}</h3>
  </>
);

【讨论】:

    【解决方案2】:

    这实际上非常简单。您唯一需要做的就是将“setRow”函数也传递给您的子组件。现在,只要您想更新父组件中的状态,您基本上都可以在子组件中调用函数 prop。

    但是,我认为值得一提的是,组件的状态和全局变量不是一回事。我强烈建议您阅读有关组件、状态和道具的 React 文档。它会让事情变得更清楚!

    【讨论】:

      猜你喜欢
      • 2020-12-29
      • 1970-01-01
      • 2017-03-08
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-05-23
      • 1970-01-01
      • 2020-08-24
      相关资源
      最近更新 更多