我有两个功能，第一个我收到所有订单，第二个我收到所有拒绝的订单

所以在第一个函数中，我根据第二个函数状态更新状态，它运行良好

但是当我从 Firebase 控制台中删除一个项目时，虽然我使用了，但我无法立即看到更新 on("value",()=>{})

那么我该如何处理呢？

警告

无法对卸载的组件执行 React 状态更新。这是一个空操作，但它表明您的应用程序中存在内存泄漏。

结构数组

let ordersArray = [
   {"snapshotKey":"-awdawadsdwwd","username":"Joe"},
   {"snapshotKey":"-badsdasdad","username":"Annna"},
   {"snapshotKey":"-dasQwaddas","username":"lee"}
]

let rejectedOrders = ["-awdawadsdwwd","-dasQwaddas"] 

状态

this.state = {
      orders: [],
      rejectedOrders: [],
    };


componentDidMount() {
    try {
      this.getRejectedOrders();
      this.fetchOrders();
    } catch (err) {
      console.log('error', err);
    }
}

第一个函数

//Get all orders from DB

 fetchOrders = async () => {
    const {serviceName} = this.state;
    let uid = auth().currentUser.uid;
    const serviceStorage = await AsyncStorage.getItem('service');
    this.setState({serviceStorage});
    database()
      .ref(`Providers/CategoriesOrders/${serviceName || serviceStorage}`)
      .on('value', snapshot => {
        let orderArr = [];
        snapshot.forEach(childSnapshot => {
          orderArr.push({
            snapshotKey: childSnapshot.key,
            username: childSnapshot.val().username,
          });
        });
        this.setState(prevState => ({
          orders: orderArr.filter(
            order =>
              !prevState.rejectedOrders.some(key => order.snapshotKey === key),
          ),
          loading: false,
        }));
      });
  };

第二个功能

// get an array of rejected orders

  getRejectedOrders = () => {
    let uid = auth().currentUser.uid;
    const ref = database().ref(`Providers/users/${uid}`);
    ref.on('value', snapshot => {
      let rejectedOrders = snapshot.val().rejectedOrders;
      this.setState({rejectedOrders});
    });
  };

JSX

render(){
   return (
        <OrdersList
          data={this.state.orders}
          extraData={this.state}
          screenName="OrderHomeDetails"
        />
      );
}

零件

const OrdersList = props => {
  return (
    <View style={styles.container}>
      <FlatList
        showsVerticalScrollIndicator={false}
        data={props.data}
        extraData={props.extraData}
        ListEmptyComponent={<EmptyList />}
        keyExtractor={(item, index) => index.toString()}
        legacyImplementation={true}
        contentContainerStyle={{
          flexGrow: 1.2,
        }}
        renderItem={({item}) => {
          return (
            <TouchableOpacity
              onPress={() =>
                props.navigation.navigate(props.screenName, {
                  username: item.username,
                  snapshotKey: item.snapshotKey,
                })
              }
             >

                <View>
                  <Icon name="person" color="#AEACAC" size={20} />
                  <Text> {item.username}</Text>
                </View>

            </TouchableOpacity>
          );
        }}
      />
    </View>
  );
};

export default withNavigation(OrdersList);

我认为 OrdersList 组件的问题，因为当我在每个函数“fetchOrders() /getRejectedOrders()”内的 setState 之后的回调中记录状态时，我得到了新的拒绝订单，而不是 fetchOrders() 内的订单

尽管

“当我向被拒绝的订单数组添加/删除数据时，这意味着 getRejectedOrders() 只会改变但 fetchOrders() 不会因为它与这些事情无关'它在第一次获得所有订单然后根据某些东西过滤它而这些订单没有变了为什么还要更新！”

编辑 ~ 1

fetchOrders = async () => {
    const {rejectedOrders, serviceName} = this.state;
    let uid = auth().currentUser.uid;
    const serviceStorage = await AsyncStorage.getItem('service');
    this.setState({serviceStorage});
    // await this.getRejectedOrders();
    database()
      .ref(`Providers/CategoriesOrders/${serviceName || serviceStorage}`)
      .on('value', snapshot => {
        let orderArr = [];
        snapshot.forEach(childSnapshot => {
          orderArr.push({
            snapshotKey: childSnapshot.key,
            username: childSnapshot.val().username,
          });
        });
        this.setState(
          prevState => ({
            orders: orderArr.filter(
              order =>
                !prevState.rejectedOrders.some(
                  key => order.snapshotKey === key,
                ),
            ),
            loading: false,
          }),
          () => console.log(this.state.orders), // I don't git anything if i add or delete rejected orders
        );
        console.log(orderArr); // I don't git anything if i add or delete rejected orders
      });
  };



 getRejectedOrders = async () => {
    let uid = auth().currentUser.uid;
    database()
      .ref(`Providers/users/${uid}`)
      .on('value', snapshot => {
        let rejectedOrders = snapshot.val().rejectedOrders;
        this.setState({rejectedOrders}, () =>
          console.log(this.state.rejectedOrders), // here's i got every single time i add or delete item i can see it in console log
        );
      });
  };




 <OrdersList
          data={this.state.orders}
          extraData={this.state.orders.length} // i add it but it's not effected 
          screenName="OrderHomeDetails"
        />