前言
提示:以下是本篇文章正文内容,下面案例可供参考
最近对FLatList的文档又学习了一遍,发现有个参数叫keyExtrator,对他的英文或是中文翻译都有点懵逼,于是想把它搞清楚。参考文章
一、FlatLIst data
相信不少用RN的对Flatlist都很熟悉,一般情况下,我们制定FLatLIst的data需要传入一个列表,列表中的元素为对象,对象中一般我们会在指定该元素的id,以方便FlatList识别每一个元素的顺序。在FlatList中,如果我们使用id或key作为data的顺序密匙名称,我们是不需要指定keyExtractor的,因为RN默认将key或id作为了这个密匙名称。
二、什么时候使用keyExtractor参数
当你的密匙名称不叫key或id的时候,你就要告诉FlatList,你是用的密匙名称是什么,这时候就要用到keyExtractor.
例如你的data是这样的,你的密匙叫userId
const DATA_WITH_USER_ID = [
{
userId: 1,
title: 'quidem molestiae enim'
},
{
userId: 2,
title: 'sunt qui excepturi placeat culpa'
},
{
userId: 3,
title: 'omnis laborum odio'
},
{
userId: 4,
title: 'non esse culpa molestiae omnis sed optio'
}
]
那么就要指定keyExtractor为userId
<FlatList
data={DATA_WITH_ID}
renderItem={renderList}
keyExtractor={item => item.userId}
/>