react-native - 为什么给 FlatList 一个数组不起作用？

Question

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

如果我将 my 更改为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阵列到底有什么不同？

标签： react-nativereact-native-flatlist

Answer 1

你renderItem的功能应该像

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

在您的实际代码中，您已将其定义为

renderItem(item)

传递给的对象renderItem有一个item属性，您可以访问item使用对象解构，如renderItem({item})

希望这会有所帮助！