如何通过 FlatList 将密钥传递到它的 renderItem 中？答案

【问题标题】：How do I pass a key through a FlatList into its renderItem?如何通过 FlatList 将密钥传递到它的 renderItem 中？
【发布时间】：2019-06-06 14:43:21
【问题描述】：

我的 react 本机应用程序上有一个提要屏幕，其中包含一个列表组件：

<List
    refreshControl={
        <RefreshControl
            tintColor={'#E4E4E4'}
            refreshing={this.state.loading}
            onRefresh={this._onRefresh}
        />
    }
    onPressFooter={this.onEndReached}
    data={this.state.posts}
/>

...从 List.js 导入，这是一个 FlatList 组件：

class List extends React.Component {
    renderItem = ({ item }) => <Item {...item} />;
    keyExtractor = item => item.key;

    render() {
        const { ...props } = this.props;
        return (
            <FlatList
                ref={(ref) => { this.listRef = ref; }}
                keyExtractor={this.keyExtractor}
                renderItem={this.renderItem}
                ListFooterComponent={footerProps => (
                    <Footer {...props} />
                )}
                showsVerticalScrollIndicator={false}
                {...props}
            />
        );
    }

在 List.js 的 this.props 中，我可以访问 this.props.key，它是 Firebase 数据库中一行的键，但我无法访问 renderItem 中的那个键。在 Item.js 中，我只能访问存储在该行中的数据，而不是行唯一键。

如何在 Item.js 中访问该密钥？我认为我只是错误地传递了值？

【问题讨论】：

标签： firebase react-native expo

【解决方案1】：

想通了，那是愚蠢的。我认为这是 keyExtractor 的结果，但我仍然可以单独传递密钥，例如...

renderItem({item}) {
    return (
        <Item
            _key={item.key}
            {...item}
        />
    )
}

【讨论】：