antd-mobile 的infinitescroll组件带搜索案例出错，如何解决？

Question

  const [gasTrajectoryData, setGasTrajectoryData] = useState([])
  const [qpNo, setQpNo] = useState("")
  const [hasMore, setHasMore] = useState(true)
  const [currentPage, setCurrentPage] = useState(1)
  const pageSize = 10
  useEffect(() => {
     loadMore()
  }, [])

  const onSearch = async () => {
    setCurrentPage(1)
    setGasTrajectoryData([])
    setHasMore(true)
    await loadMore()
  }

  const loadMore = async () => {
    try {
      const response = await apiClient.get(
        `/qpsf/airBottleData/${currentPage}/${pageSize}/?qpNo=${qpNo}`
      )
      if (response.data.data.length === 0) {
        setHasMore(false) // 没有数据
      } else {
        setGasTrajectoryData([...gasTrajectoryData, ...response.data.data])
        setCurrentPage(currentPage + 1)
      }
    } catch (error) {
      console.error("Error fetching data:", error)
    }
  }

照着官网的InfiniteScroll 组件实现带搜索的无限滚动，但是在搜索时出现了一点小问题，第一次点击搜索时，没有数据，再点击一次后数据就有了，打开控制台发现currentPage是旧值导致搜不到

加了await和延迟几秒都没用，不知道该怎么解决了

Answer 1

从你提供的代码来看，它应该能够正常工作。然而，我无法直接看到你的完整代码，所以只能给出一些通用的建议。

1. 确保你的 apiClient.get 函数正确处理请求，并且服务器返回的数据格式正确。例如，服务器应该返回一个对象，其中包含一个名为 "data" 的属性，该属性包含你要的数据。
2. 确保你在调用 setGasTrajectoryData 函数时，新的数据已经被添加到旧的数据后面。你的代码已经这样做了，但是要确保 gasTrajectoryData 是一个数组，并且你的服务器返回的数据也可以被合并到数组中。
3. 确保你在搜索时正确地传递了查询参数 qpNo。你可以在 apiClient.get 函数的URL中打印出来，看看是否正确。
4. 如果你的问题与异步操作有关，尝试使用 useRef Hook 来存储异步操作的结果。这可以帮助你更好地理解异步操作何时完成。
5. 最后，确保你的组件已经正确地挂载，并且所有的状态变量和函数都可以被访问到。

如果这些建议都不能解决你的问题，我建议你提供更多的代码和错误信息，这样我可以更具体地帮助你。