React Native Expo运行出现Too Many Renders无限渲染报错求解决

• 你在组件渲染流程中直接调用了setVisible状态更新函数，没有用函数包裹：

// 错误写法：组件每次渲染都会直接执行setVisible，触发重渲染死循环
const showModal = setVisible(true);
const hideModal = setVisible(false);

• 状态更新会触发组件重渲染，重渲染后又会再次执行这两行代码更新状态，无限循环后触发React的渲染次数限制报错。

把showModal和hideModal改成函数声明，仅在事件触发时才执行状态更新：

// 正确写法
const showModal = () => setVisible(true);
const hideModal = () => setVisible(false);

• 给searchquery设置初始空字符串，避免搜索框出现非受控组件警告：

const [searchquery, setSearchquery] = React.useState('');

• 长列表建议替换ScrollView + map的写法为FlatList，性能更好，不用手动处理key：

// 替换原ScrollView代码段
<FlatList
  data={users}
  keyExtractor={item => item.id.toString()}
  renderItem={({item}) => <Text style={styles.names}>{item.name}</Text>}
  contentContainerStyle={{paddingHorizontal: 10}}
/>

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