React Native FlatList未渲染列表项问题求助

你的FlatList无法渲染列表项，核心有两个问题：

1. renderItem 未返回JSX元素 #

当前的renderItem回调中，你定义了JSX但没有返回它。JavaScript函数如果用大括号包裹代码块，必须显式使用return语句返回值，或者改用圆括号实现箭头函数的隐式返回。

2. onPress 错误触发状态更新 #

你写的onPress={setMinBeds(item.value)}会在组件渲染阶段直接调用setMinBeds，而不是在点击时触发。这不仅会导致不必要的状态更新，还可能引发渲染循环，必须用箭头函数包裹，确保点击动作触发时才执行状态更新。

修复后的代码 #

<View>
  <Text>Min. Beds:</Text>
  <FlatList 
    data={bedCount}
    horizontal={true}
    keyExtractor={item => item.key}
    renderItem={({ item }) => (
      <TouchableOpacity onPress={() => setMinBeds(item.value)}>
        <Text>{item.label}</Text>
      </TouchableOpacity>
    )}
  />
</View>

额外说明：renderItem的参数是一个包含item属性的对象，使用({ item })解构获取当前项是React Native的标准写法，能避免直接操作参数对象带来的混淆。

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