未在React组件中定义'函数'

Question

我对于使用反应非常新，所以我尝试创建一个小型定时器应用程序，但运行此代码时收到以下错误：
（第40行：' timeDisplay”没有定义没有基金）

class Home extends React.Component { 
    constructor(props) { 
     super(props); 


     // Four states: 
     // work , workStop, break, breakStop 

     this.state = { 
      status: 'workStop', 
      time: 1500 
     } 
    } 

    componentDidMount() { 
     var interval = setInterval(this.timeTick, 1000); 
     this.setState({interval}); 
    } 

    componentWillUnmount() { 
     clearInterval(this.state.interval); 
    } 

    timeTick =() => { 
     if (this.state.time !== 0) 
      this.setState({ 
       time: this.state.time - 1 
      }); 
    } 

    timeDisplay =() => { 
     const minute = Math.floor(this.state.time/60); 
     const second = (this.state.time % 60) < 10 ? '0' + (this.state.time % 60) : (this.state.time % 60); 
     return (minute + ' : ' + second); 
    } 

    render() { 
     const time = timeDisplay(); 
     return (
      <div> 
       <p className='timer'>{time}</p> 
      </div> 
     ) 
    } 
} 

不知道该怎么在这种情况下做的，我用箭头功能定义的组件内部的timeDisplay方法。

Answer 1

那么timeDisplay是Home组件实例的成员。您需要this才能访问该功能。因此，使用：

const time = this.timeDisplay();

是正确的，而不是

const time = timeDisplay();

Answer 2

在类访问实例方法总是使用this。