父组件start状态变更时React自定义useData Hook未触发API请求

核心问题出在自定义Hook的参数传递方式不匹配：

你的useData Hook定义时，接收的是一个包含start属性的对象参数：

export default function useData({ start = 0 }) { ... }

但在父组件CryptoList中调用时，直接传递了start变量：

const { result, error, isError, isLoading, hasNextPage } = useData(start);

这会导致useData内部始终读取的是默认值0，完全没有接收到父组件传递的start更新，自然不会触发useEffect发起新请求。

修复步骤 #

只需要修改父组件中useData的调用方式，传入包含start属性的对象即可：

// 原代码
const { result, error, isError, isLoading, hasNextPage } = useData(start);

// 修改后
const { result, error, isError, isLoading, hasNextPage } = useData({ start });

验证逻辑 #

修改后，当父组件的start状态更新时，useData Hook的start参数会同步变化，触发useEffect的依赖更新，进而执行新的API请求，实现无限滚动加载的预期效果。

内容的提问来源于stack exchange，提问作者MnR