为什么给 FlatList 一个数组是行不通的？

Question

我将我的数据解析为一个数组并将其放入我的 FlatList 但我的 renderItem 函数不起作用。

如果我将 movieData 更改为像 const movieData =[1, 2, 3, 4]; 这样的简单数组，将其更改为 FlatList 就可以了。

所以我不明白为什么我的数据不起作用。

这是我的 render 和 renderItem 函数：

  renderItem = (item) => {
    console.log('renderItem =>');
    console.log(item);
    return (
      <View>
        <Text>Hi</Text>
      </View>
    );
  }
render() {
    console.log('Render MainActivity=>');
    const movieData = this.props.mainMovie;
    console.log(movieData);

    return (
    <View>
      <FlatList
        data={movieData}
        renderItem={this.renderItem} 
        numColumns={1}
        horizontal={false}
        keyExtractor={(item, index) => index} 
      />
      </View>
    );
  }

我可以看到我的 console.log(this.props.mainMovie); 是这样的，我认为它是一个数组：

为什么它对 renderItem 不起作用？任何帮助将不胜感激。

提前致谢。

我像这样再次测试数组：

const test = [{ number: '1' }, { number: '2' }, { number: '3' }];

正在运行。

我的 movieData 数组究竟有何不同？

Answer 1

你的renderItem函数应该像

renderItem = ({ item }) => {
  console.log('renderItem =>');
  console.log(item);
  return (
    <View>
      <Text>{...}</Text>
    </View>
  );
}

在你的实际代码中，你已经这样定义了它

renderItem(item)

传递给 renderItem 的对象有一个 item 属性，您可以使用像 renderItem({item})

这样的对象解构来访问 item

希望这会有所帮助！

为什么给 FlatList 一个数组是行不通的？

Why give an array to FlatList is no working?

react-native

react-native-flatlist