1.首先自己郁闷为什么在constructor里面必须要有super。
constructor(props){ 以前一直纳闷，为什么需要用到constructor的时候，都会有一个super，搜了一下是因为初始化this，
super(props) 不然没有this。想看具体以上的可以看网址
this.state={
hour:'',
minutes:'',
seconds:''
}
}
好了，接下来看我写的一个超简单的倒计时
importReact, { Component }from'react';
import{
AppRegistry,
StyleSheet,
View,
Text,
Button,
}from'react-native';
export default classLoginextendsComponent {
constructor(props){
super(props);
this.state={
hour:'1',
minutes:'0',
seconds:'2',
};
}
componentWillMount() {
this._timer&&clearInterval(this._timer);
}
go_hour(){
varhu=this.state.hour;
if(hu>0){
hu--;
this.setState({hour:hu});
return1;
}else if(hu==0){
this.setState({hour:'00'});
return0;
}
};
//在这里实现借分
go_minuter(){
varmin=this.state.minutes;
if(min>0){
min--;
this.setState({minutes:min});
return1;
}else if(min==0){
varget_hu=this.go_hour();
if(get_hu==1){
this.setState({minutes:59});
return1;
}else{
this.setState({minutes:'00'});
return0;
}
}
};
//计时函数
countTime(){
this._timer=setInterval(()=>{
// 获取秒
varsc=this.state.seconds;
if(sc>0){
sc--;
this.setState({seconds:sc});
}else if(sc==0){
varget_mt=this.go_minuter();
// 如果是1的话节分成功，0就是借分失败
if(get_mt==1){
sc=59;
this.setState({seconds:sc});
}else if(get_mt==0){
this._timer&&clearInterval(this._timer);
}
}
},1000)
}
render() {
return(
{this.state.hour}:{this.state.minutes}:{this.state.seconds}
onPress={this.countTime.bind(this)}
title="开始计时"
color='#841584'
accessibilityLabel="开始计时"
/>
);
}
}
AppRegistry.registerComponent('Login', () => Login);
倒计时的代码，是一个很简单的倒计时。
网友评论