Javascript 在react功能中显示每秒更新的时间

它必须是一个函数，不能是一个类。如果类能够使用setInterval在componentDidMount中执行此操作，则

我设置了这样的东西

function DisplayTime() {
  let time = new Date().getTime();
  setInterval(() => {
    time = new Date().getTime();
  }, 1000);
  return time;
}
ReactDOM.render(<DisplayTime />, document.getElementById('root'))

问题是函数只能运行一次，所以时间无法得到更新。像setInterval=>{ReactDOM.render…，…}这样的东西效率很低，这是不可接受的

有什么想法吗

===

---

useState是高级解决方案，任何未使用最新版本的React的解决方案？

您尚未向setInteval提供实际时间间隔。@ScottMarcus，感谢您指出；但这是我现在解决的小问题。我的主要问题是如何构造一个在渲染后可以保持更新的函数？您可以多次运行该函数。只需执行clearInterval，然后再次调用它。您需要一个具有状态的组件，该组件每分钟更新一次状态，从而重新渲染。@zerkms，是的，您是对的，这就是我要问的。如何创建这样的组件？组件必须使用我说过的函数。useState是advanced，还有其他解决方案吗？我仍然会记下你的名字answer@WeijingJayLin为什么您不使用数百万可用教程或官方文档中的任何一个来学习React？乞求为您实现它并不能使您成为更好的开发人员

import React, { useState } from "react";
import ReactDOM from "react-dom";

import "./styles.css";

function App() {
  const [time, setTime] = useState(new Date().getTime());
  setInterval(() => {
    setTime(new Date().getTime());
  }, 1000);
  return (
    <div className="App">
      <h1>{time}</h1>
      <h2>Start editing to see some magic happen!</h2>
    </div>
  );
}

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