在react-app中加载bundle.js失败。该应用程序无法按预期工作

时间:2018-06-15 07:49:34

标签: javascript html css reactjs

我最近开始学习反应。我正在尝试制作秒表,以下是代码。

import React, {
    Component
} from 'react'

class Timer extends Component {
    constructor(props) {
        super(props);
        this.state = {
            minutes: 0,
            seconds: 0,
        };

        this.startTimer = this.startTimer.bind(this)
        this.stopTimer = this.stopTimer.bind(this)
        this.changingTime = this.changingTime.bind(this)
    }

    startTimer() {
        let d = new Date();
        let startMin = d.getMinutes();
        let startSec = d.getSeconds();
        this.myVar = setInterval(this.changingTime(startMin, startSec), 1000)
    }

    changingTime(min, sec) {
        let date = new Date();
        this.setState({
            minutes: date.getMinutes() - min,
            seconds: date.getSeconds() - sec
        })
    }

    stopTimer() {
        clearInterval(this.myVar);
    }

    render() {
        return(<div><p> I am timer </p>
            <
            Timing minutes = {
                this.state.minutes
            }
            seconds = {
                this.state.seconds
            }
            /> <
            p > minutes < /p>
            <
            button onClick = {
                this.startTimer
            } > Start < /button> <
            button onClick = {
                this.stopTimer
            } > Stop < /button> < /
            div >
        );
    }
}

class Timing extends Component {
    render() {
        return ( <
            h6 > {
                this.props.minutes
            }: {
                this.props.seconds
            } <
            /h6>
        );
    }
}

export default Timer;

我在App.js中添加了<Timer/>。我使用create-react-app创建了应用程序。页面加载并显示加载时需要显示的内容。但秒表不能按预期工作。

this is the screenshot。如您所见,页面正确加载但之后不起作用。控制台显示bundle.js加载失败错误。但我无法理解这是不正确工作的原因还是我的代码有问题。

0 个答案:

没有答案