小编Dar*_*iad的帖子

React 类中的清除间隔

因此,我们有这个简单的 React 组件,它从父组件接收一个整数。单击该按钮后,我们会在屏幕上显示整数并开始倒计时。

问题是如何停止倒计时。在阅读其他 SO 帖子时,我发现了clearInterval(),但似乎我在这里遗漏了一些东西。

任何帮助将不胜感激。如果有人好心地向我解释为什么示例代码不能按预期工作,将获得奖励积分。

    import React from "react";

    export default class TestInterval extends React.Component {
        constructor(props) {
            super(props);
            this.state = {
                countDown: this.props.countDown, // An integer from father component
            }
        }

        timer = () => {
            setInterval(() => {
                if (this.state.countDown === 0) {
                    this.stopCountDown();
                }
                this.setState( prevState => ({
                    countDown: prevState.countDown - 1, 
                }));
            }, 1000)
        }

        startCountDown = () => {
            this.timer();
        }

        stopCountDown = () => {
            clearInterval(this.timer); // Not working
        }

        render () …
Run Code Online (Sandbox Code Playgroud)

javascript clearinterval ecmascript-6 reactjs

5
推荐指数
1
解决办法
5859
查看次数

标签 统计

clearinterval ×1

ecmascript-6 ×1

javascript ×1

reactjs ×1