2

我正在尝试向实时数据库 Firebase 添加步骤。当我添加步骤时，它在数据库中工作，但随后模态关闭，我没有任何错误，但模态无故关闭

我认为问题是当我调用 firebase 来更新它时（在 addTodo 函数中），但我不知道为什么。

TodoModal.js：

  componentDidMount = async () => {
    this.mounted = true;
  };

  compunentWillUnmount = () => {
    this.mounted = false;
  }

  addTodo = async () => {
    if (this.state.newStep !== "") {
       try {
        await firebase
          .database()
          .ref("Tasks")
          .child(firebase.auth().currentUser.uid).child(firebase.auth().currentUser.uid)
          .child(this.props.task.taskname)
          .child("Steps")
          .child(this.state.newStep)
          .update({ title: this.state.newStep, status: false, dateAdd: date });
        this.props.addStep({ title: this.state.newStep, status: false, dateAdd: date }); 
        if (this.mounted) {
          this.setState({ newStep: "" });//to reinitialize the newStep field
        }

      } catch (error) {
        console.log(error);
      } 
    } else {
      Alert.alert("","field is required");
    }
  };
  };




  render() {
    return (
            <View>
              <TextInput
                onChangeText={(text) => this.setState({ newStep: text })}
                value={this.state.newStep}
              />
              <TouchableOpacity
                onPress={() => this.addTodo()}
              >
              </TouchableOpacity>
            </View>
    );
  }
}

);

TodoTask.js：

render() {
    const task = this.props.task;
    return (
      <View>
        <Modal
          animationType="slide"
          visible={this.state.showTaskVisible}
          onRequestClose={() => this.toggleisModal()}
        >
          <TodoModal task={task} closeModal={() => this.toggleisModal()} />
        </Modal>
       </View>
      )
4

1 回答 1

0

当异步函数结束并且触发该函数的组件被卸载时，就会发生该错误，因此异步函数的结果会尝试更新不再存在的事物的状态。

通常，为了防止这种情况，您必须要么拒绝承诺，要么在尝试修改其状态之前检查组件是否仍然挂载。

您可以跟踪已安装的状态，例如

componentDidMount = () => {
  this.mounted = true;
}

compunentWillUnmount = () => {
  this.mounted = false;
}

那么您可以this.mounted在尝试更改状态之前检查是否。

于 2021-11-21T00:05:14.510 回答