React Native中Hook调用无效求助：事件处理函数内调用useEffect报错

错误原因 #

你把useEffect这个React Hook直接放在了普通事件处理函数handleEvento里面，违反了React Hook的核心规则：Hook只能在函数组件的顶层作用域调用，或者在自定义Hook的顶层调用，不能嵌套在普通函数、条件判断、循环这类代码块里。

修正后的代码 #

直接去掉useEffect，在handleEvento里发起请求即可——这是用户点击日期触发的异步操作，不需要依赖Hook的副作用监听逻辑：

const handleEvento = async (dayy) => {
  try {
    const response = await axios.get(`http://192.168.15.11:8085/api/readEventsByDate/${dayy}`);
    // 按id升序排序数据
    const sortData = response.data.sort((a, b) => a.id - b.id);
    setData2(sortData);
    // 注意：setState是异步的，直接log data2可能拿不到最新值，建议打印排序后的结果
    console.log(sortData);
  } catch (error) {
    console.log(JSON.stringify(error));
  }
};

onDayPress={day => {
  handleEvento(day.dateString);        
}}

额外提示 #

如果需要查看data2更新后的最新值，因为setData2是异步操作，不能在调用后直接打印data2，可以在组件顶层加一个useEffect监听：

useEffect(() => {
  console.log(data2);
}, [data2]);

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