我如何在反应中取消setTimeout时间

Question

我创建了一个应用程序，其中按下按钮时时钟时间开始。 如果23秒（23000）设置为0并且状态更改为（this.state.user）之后什么也不做，这是正确的。

如果再次单击该元素，则需要将23秒（23000）归零并清除超时。 因为如果超时还剩一些时间，该项目将自动关闭。

我尝试了“ clearTimeout（this.change）; clearInterval（this.change）;”，但是它不起作用，我不知道如何取消这次。

class Header extends Component {
    constructor(props) {
        super(props);

        this.change = null;

        this.state = {
            usuario: true,
            timeElapsed: 0,
            adminOrWrap: true,
        };

        ["descansoAdminWrap", "otrosDescansos",].forEach((method) => {
            this[method] = this[method].bind(this);
        });
    }

   componentDidUpdate(prevProps, prevState) {
        if (prevProps.notInCall === false && this.props.notInCall && this.state.usuario === true) {
            this.descansoAdminWrap(prevProps, prevState);
       }
   }

    descansoAdminWrap(prevProps){
        var usuarioAdminOrWrapFalse=  this.state.usuario && this.props.adminOrWrap === false;
        var notInCallFalseUsuario= this.props.notInCall === false && this.state.usuario
        //mostrar y ocultar el descanso de 'tiempo administrativo' y 'wrap time'
        if(this.state.usuario && this.props.notInCall){
            this.setState({
                usuario: false,
                timeElapsed: 0,
            });
            clearTimeout(this.change);
            clearInterval(this.change);
            if(prevProps.notInCall === false){
                this.handleAdminOrWrap(false)
                this.setState({
                    usuario: false,
                    timeElapsed: 0,
                });
                this.change = setTimeout(() => {
                    this.setState({
                        usuario: true,
                        notInCall: true,
                    });
                    this.handleAdminOrWrap(true)
                }, 23000)
            }
        }
    }

Answer 1

clearTimeout用于setTimeout ， clearInterval用于setInterval 。

因此，在此处使用clearInterval将无济于事。

我会检查您是否真的希望在if条件内使用console.log调用clearTimeout 。 尤其是在您第一次将state.usuario值修改为false时，这将阻止您再次清除条件。