react-native - 函数 clearInterval() 不起作用 React Native

Question

我试图停止 setInterval 函数，该函数在我们单击后每 100 毫秒生成一个随机数，但我的 clearInterval 不会做任何事情。

import React, {useState} from 'react';
import { Text, View, TouchableOpacity } from 'react-native';

export default function App() {
    const [randomNumber, setRandomNumber] = useState ('CLICK');
    const generateRandomNumber = () => {
        setInterval(() => {setRandomNumber(Math.floor(Math.random() * 100) + 1 )}, 100);
    };
    const stopWheel = () => {
        clearInterval(generateRandomNumber);
        console.log(randomNumber);
    };
    const spinWheel = () => {
        generateRandomNumber();
        setTimeout(stopWheel, 2000);
    };
    return (
      <View>
        <TouchableOpacity onPress={spinWheel}>
          <Text>{randomNumber}</Text>
        </TouchableOpacity>
      </View>
    );
  };

标签： react-native

Answer 1

这是因为您试图清除函数而不是间隔。尝试这样的事情：

let timer;
  const generateRandomNumber = () => {
    timer = setInterval(() => { setRandomNumber(Math.floor(Math.random() * 100) + 1) }, 100);
  };
  const stopWheel = () => {
    clearInterval(timer);
    console.log(randomNumber);
  };