Question

我正在使用Firebase来使身份验证系统响应本机，并且我想为用户打印诸如“电子邮件无效”之类的文本输入错误，但我成功了，但它并不仅仅局限于此。过一会儿我怎样才能消失？像在上面放一个计时器之类的东西

功能如下：

handleSignUp = () => {
    firebase.auth().createUserWithEmailAndPassword(this.state.email, this.state.password)
            .catch(error => this.setState({errorMessage: error.message}))
  }

这是我使用它的部分：

<TouchableOpacity 
   style={styles.userBtn}
   onPress={this.handleSignUp}>
   <Text style={styles.btnTxt}>SignUp</Text>
</TouchableOpacity>

enter image description here 而带下划线的文字就是问题所在

Answer 1

使用componentDidUpdate生命周期，将在组件更新后立即调用

componentDidUpdate(){
    setTimeout(() => this.setState({errorMessage:''}), 3000);
  }

Answer 2

我将在设置错误消息后立即添加一个setTimeout，如下所示：

handleSignUp = () => {
  firebase.auth().createUserWithEmailAndPassword(this.state.email, this.state.password)
    .catch(error => {
      this.setState({errorMessage: error.message});
      clearTimeout(this.timeoutId); // Prevents remove error if many errors occur in less than 3000ms
      this.timeoutId = setTimeout(() => this.setState({errorMessage: ''}), 3000);
    })
}

也不要忘记清除超时以防止泄漏：

componentWillUnmount() {
  clearTimeout(this.timeoutId);
}

使消息消失。反应本机

2 个答案: