[英]'function' is not defined within React Component
I'm very new to working with react so I tried to create a small timer application, but I receive the following error when I run this code: 我对使用React非常陌生,因此尝试创建一个小型计时器应用程序,但是在运行此代码时收到以下错误:
(Line 40: 'timeDisplay' is not defined no-undef) (第40行:“ timeDisplay”未定义为no-undef)
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>
)
}
}
Not sure what to do in this situation, I used the arrow function for defining the timeDisplay method inside the component. 不知道在这种情况下该怎么做,我使用了箭头功能来定义组件内部的timeDisplay方法。
Well timeDisplay
is member of instance of Home component. 好时间
timeDisplay
是Home组件实例的成员。 You need this
to access that function. 您需要使用
this
来访问该功能。 Therefore using : 因此使用:
const time = this.timeDisplay();
is the correct one instead 是正确的代替
const time = timeDisplay();
要访问类中的实例方法,请始终使用this
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.