Javascript 当重新更新数据时，UseEffect钩子不能正常工作？

我有一个订单列表，我用FlatList来呈现它们， 我有两个主要概念，我应该有“加载更多，拉动刷新”

在我的例子中，用户可以编辑顺序，然后拉刷新以获得新更新的数据，另一个例子是加载更多的“分页”

所以 加载更多功能可以正常工作，并从服务器获取新数据，并使用旧数据推送到状态

但是pull to refresh不起作用，它在设置state时不会更新数据，虽然触发了获取数据的函数，而且我可以在控制台中看到更新的数据，但它只是呈现旧数据

下面是一段代码片段

const OpenedAppointments = () => {
  const [openedAppointment, setOpenedAppointment] = useState([]);
  const [currentPage, setCurrentPage] = useState(1);
  const [lastPage, setLastPage] = useState(null);
  const [loading, setLoading] = useState(false);
  const [isFetch, setIsFetch] = useState(false);


 const loadMoreOrders = () => {
    if (currentPage <= lastPage - 1) {
      setLoading(true);
      setCurrentPage((prevPage) => prevPage + 1);
      console.log('loadMore??');
    }
  };


  const getOpenOrders = useCallback(() => {
    let AuthStr =
      'Bearer ';

    const headers = {
      'Content-Type': 'application/json',
      Authorization: AuthStr,
    };
    Api.post(
      `/open_orders?page=${currentPage}`,
      {},
      {
        headers,
      },
    )
      .then((res) => {
        let last_Page = res.data.open_orders.last_page;
        let allOpenedOrders = res.data.open_orders.data;
        console.log('allOpenedOrders', allOpenedOrders);
        console.log('last_Page', last_Page);
        console.log('currentPage', currentPage);
        setLastPage(last_Page);
        setOpenedAppointment((prevOpenedOrders) => [
          ...prevOpenedOrders,
          ...allOpenedOrders,
        ]);
        setLoading(false);
        setIsFetch(false);
      })
      .catch((err) => console.log('err', err));
  }, [currentPage]);
    
 // Delete Appointments
  const cancelAppointem = (appointmentID) => {
    let AuthStr =
      'Bearer...';

    const headers = {
      'Content-Type': 'application/json',
      Authorization: AuthStr,
    };
    Api.post(
      '/cancel/order',
      {
        id: appointmentID,
      },
      {
        headers,
      },
    )
      .then((res) => {
        setIsOpenedCancelModal((opened) => !opened);
        console.log(res.data);
        setOpenedAppointment((prev) =>
      prev.filter((item) => item.id !== appointmentID),
    ); // works very well
      })
      .catch((err) => console.log(err));
  };

  const _refresh = () => {
    setIsFetch(true);
    getOpenOrders();
  };

  useEffect(() => {
    getOpenOrders();
  }, [getOpenOrders]);

  const keyExtractor = (item, index) => String(index);



  return (
    <FlatList
      showsVerticalScrollIndicator={false}
      contentContainerStyle={styles.flatListCon}
      data={openedAppointment}
      ListEmptyComponent={renderEmpty}
      renderItem={renderItems}
      keyExtractor={keyExtractor}
      ListFooterComponent={_renderFooter}
      onEndReached={loadMoreOrders}
      onEndReachedThreshold={0.1}
      onRefresh={_refresh}
      refreshing={isFetch}
    />
  );
};

---

你的效果应该很好

  const _refresh = () => {
    setIsFetch(true);
  };

  useEffect(() => {
    getOpenOrders();
  }, [isFetch]);

---

嘿，它没有按预期工作！在useEffect中的另一件事是，我从linter

React-Hook得到了这个警告，useEffect缺少一个依赖项：“getOpenOrders”。包括它或删除依赖项数组。

此外，我可以获得重复的数据，正如您在

解决问题
部分中看到的一样嘿！首先呈现
openedapoint
它是空的，那么我们在这种情况下如何使用.map（）？我猜当我调用
loadMoreOrders
时，它会增加当前页面，并基于它
getOpenOrders
再次获取并替换平面列表中的退出数据，或者在更新
数据时，我猜是这样的，得到的数据不是你编辑的我知道这里有什么问题。例如，
currentPage
是2，但是您更改了第一页的
数据
，因此当您从服务器获取数据时，您无法在第一次获取新的第一页的数据。当我要编辑当前页面1中前5个订单中的第一个订单时，数据将更新，当我向下滚动时，它应该从下一页“2”获取订单它刚刚取代了前5个订单，除了第一个订单仍然存在我想其他事情当我重新更新第一个订单并再次刷新时，我看不到新更新的“我知道可能你觉得它很复杂”请查看屏幕截图可能会有所帮助！
  const _refresh = () => {
    setIsFetch(true);
  };

  useEffect(() => {
    getOpenOrders();
  }, [isFetch]);


const [updatePage, setUpdatePage] = useState(1)
const [isUpdate, setIsUpdate] = useState(false)

// call `setUpdatePage` when you edit the data
/**
*  const edit = (record)=>{
*     ...
*     const updatePageIndex = openedAppointment.findIndex((item)=> item.id === record.id)
*     const updatePageNum = Math.ceil(updatePageIndex/openedAppointment.length)
*     setUpdatePage(updatePageNum)
*     setIsUpdate(true)
*  }
*  
**/
const getOpenOrders = useCallback(() => {
    const pageNum = isUpdate ? updatePage : currentPage
    let AuthStr =
      'Bearer ';

    const headers = {
      'Content-Type': 'application/json',
      Authorization: AuthStr,
    };
    Api.post(
      `/open_orders?page=${pageNum}`,
      {},
      {
        headers,
      },
    )
      .then((res) => {
        let last_Page = res.data.open_orders.last_page;
        let allOpenedOrders = res.data.open_orders.data;
        ...
        if(openedAppointment.length > 0) {
          const newOpenedOrders = openedAppointment.map((item)=>{
             const target = allOpenedOrders.find(ele=> ele.id === item.id) || []
             return {
              ...item,
              ...target,
             }
          })
          setOpenedAppointment(newOpenedOrders);
        } else {
          setOpenedAppointment(allOpenedOrders)
        }
        setIsUpdate(false)
        ...
      })
      .catch((err) => console.log('err', err));
  }, [currentPage]);