Improve VirtualizedList yellow-box warning when item is missing a key

Reviewed By: sahrens

Differential Revision: D7746659

fbshipit-source-id: b271dcd604d9adb85d0996dce5b8af1a6efd37d2
This commit is contained in:
Alex McKelvey 2018-04-24 13:40:27 -07:00 committed by Facebook Github Bot
parent f44e78df55
commit 4a802100d1
1 changed files with 6 additions and 0 deletions

View File

@ -218,6 +218,7 @@ type OptionalProps = {
export type Props = RequiredProps & OptionalProps;
let _usedIndexForKey = false;
let _keylessItemComponentName: string = '';
type Frame = {
offset: number,
@ -431,6 +432,9 @@ class VirtualizedList extends React.PureComponent<Props, State> {
return item.key;
}
_usedIndexForKey = true;
if (item.type && item.type.displayName) {
_keylessItemComponentName = item.type.displayName;
}
return String(index);
},
maxToRenderPerBatch: 10,
@ -762,6 +766,7 @@ class VirtualizedList extends React.PureComponent<Props, State> {
const itemCount = this.props.getItemCount(data);
if (itemCount > 0) {
_usedIndexForKey = false;
_keylessItemComponentName = '';
const spacerKey = !horizontal ? 'height' : 'width';
const lastInitialIndex = this.props.initialScrollIndex
? -1
@ -831,6 +836,7 @@ class VirtualizedList extends React.PureComponent<Props, State> {
console.warn(
'VirtualizedList: missing keys for items, make sure to specify a key property on each ' +
'item or provide a custom keyExtractor.',
_keylessItemComponentName,
);
this._hasWarned.keys = true;
}