如何通过点击 react native 中的 touchableOpacity 来开始倒计时?
How to start a countdown by clicking on a touchableOpacity in react native?
如何在按下 TouchableOpacity
时启动 <CountDown/>
?
最近发现了react-native的倒计时组件
倒计时自动开始,但我希望它在我单击 TouchableOpacity
时开始 运行。怎么做到的?
这是非常基本的示例,可以帮助您
constructor(props: Object) {
super(props);
this.state ={ timer: 3}
}
componentDidUpdate(){
if(this.state.timer === 1){
clearInterval(this.interval);
}
}
componentWillUnmount(){
clearInterval(this.interval);
}
startTimer(){
this.interval = setInterval(
() => this.setState((prevState)=> ({ timer: prevState.timer - 1 })),
1000
);
}
render() {
return (
<View style={{ flex: 1, justifyContent: 'center', }}>
<Text> {this.state.timer} </Text>
<Button title="Start" onPress={() => this.startTimer() } />
</View>
)
}
如何在按下 TouchableOpacity
时启动 <CountDown/>
?
最近发现了react-native的倒计时组件
倒计时自动开始,但我希望它在我单击 TouchableOpacity
时开始 运行。怎么做到的?
这是非常基本的示例,可以帮助您
constructor(props: Object) {
super(props);
this.state ={ timer: 3}
}
componentDidUpdate(){
if(this.state.timer === 1){
clearInterval(this.interval);
}
}
componentWillUnmount(){
clearInterval(this.interval);
}
startTimer(){
this.interval = setInterval(
() => this.setState((prevState)=> ({ timer: prevState.timer - 1 })),
1000
);
}
render() {
return (
<View style={{ flex: 1, justifyContent: 'center', }}>
<Text> {this.state.timer} </Text>
<Button title="Start" onPress={() => this.startTimer() } />
</View>
)
}