Question

我正在尝试显示当前时间，但不知道如何完成。

function timer()
{
  let today = new Date(),
    hours = today.getHours(),
    minutes = today.getMinutes(),
    seconds = today.getSeconds();
    console.log(hours+'/'+minutes+'/'+seconds)


  setTimeout(timer,1000)
}


function App() {
  return (
    <div >

      <h1>Timer</h1>
      <h1 id='time'>Time : {timer()}</h1>
    </div>
  );
}

我希望输出为时间：12/5/12（即当前时间）

Answer 1

您不要直接修改DOM，而是使用返回的组件来渲染和修改HTML

首先，您需要使用useState将time保存在组件state中。

第二，您需要获取使用useEffect

装入组件的时间。

然后将保存在组件time中的state渲染到DOM

function App() {
  const [time, setTime] = useState(null);

  useEffect(() => {
    let today = new Date(),
      hours = today.getHours(),
      minutes = today.getMinutes(),
      seconds = today.getSeconds();

    const now = hours + "/" + minutes + "/" + seconds;
    console.log(now);

    setTime(now);
  }, []);

  return (
    <div>
      <h1>Timer</h1>
      {time && <h1 id="time">Time : {time}</h1>}
    </div>
  );
}

如何在反应中使用document.querySelector（）。innerHTML

1 个答案: