how to clearInterval in react hook on clicking按钮

在React Hook中，要清除定时器可以使用clearInterval函数。当点击按钮时，可以通过useState来创建一个状态变量来保存定时器的ID。然后，在按钮的点击事件处理函数中，使用clearInterval函数来清除定时器。

下面是一个示例代码：

import React, { useState } from 'react';

function MyComponent() {
  const [timerId, setTimerId] = useState(null);

  const startTimer = () => {
    const id = setInterval(() => {
      // 定时器逻辑
      console.log('定时器触发');
    }, 1000);
    setTimerId(id);
  };

  const stopTimer = () => {
    clearInterval(timerId);
    setTimerId(null);
  };

  return (
    <div>
      <button onClick={startTimer}>开始定时器</button>
      <button onClick={stopTimer}>停止定时器</button>
    </div>
  );
}

export default MyComponent;

在上面的代码中，我们使用useState来创建了一个名为timerId的状态变量，并将其初始值设置为null。在startTimer函数中，我们使用setInterval创建了一个定时器，并将其ID保存到timerId状态变量中。在stopTimer函数中，我们使用clearInterval函数来清除定时器，并将timerId状态变量重置为null。

这样，当点击"开始定时器"按钮时，定时器就会开始触发，每秒输出一次"定时器触发"。当点击"停止定时器"按钮时，定时器就会被清除，不再触发。

推荐的腾讯云相关产品：云函数（Serverless Cloud Function），它是一种无需管理服务器即可运行代码的计算服务。您可以使用云函数来编写和运行定时任务，而无需关心服务器的运维和扩展。您可以通过以下链接了解更多信息：云函数产品介绍。