mirror of
https://github.com/status-im/react-native.git
synced 2025-02-25 15:45:32 +00:00
Made getItem
and getItemCount
required props (VirtualizedList)
Summary: The main reason to use **VirtualizedList** is to set the `getItem` and `getItemCount` props, so having default values for these props makes things error prone. * In **VirtualizedList**, changed the `getItem` and `getItemCount` props from optional to required, and removed default values. * Ensured that implementing classes **FlatList** and **SectionVirtualizedList** are always passing these props. * Updated VirtualizedList-test.js accordingly. Reviewed By: sahrens Differential Revision: D4980236 fbshipit-source-id: ad1838931253bc61ff9068c40929f6e9c755b92c
This commit is contained in:
parent
52e50af56d
commit
beeffb89fe
@ -178,8 +178,6 @@ type Props<ItemT> = RequiredProps<ItemT> & OptionalProps<ItemT> & VirtualizedLis
|
|||||||
|
|
||||||
const defaultProps = {
|
const defaultProps = {
|
||||||
...VirtualizedList.defaultProps,
|
...VirtualizedList.defaultProps,
|
||||||
getItem: undefined,
|
|
||||||
getItemCount: undefined,
|
|
||||||
numColumns: 1,
|
numColumns: 1,
|
||||||
};
|
};
|
||||||
type DefaultProps = typeof defaultProps;
|
type DefaultProps = typeof defaultProps;
|
||||||
|
@ -38,6 +38,14 @@ type RequiredProps = {
|
|||||||
* getItem, getItemCount, and keyExtractor to handle any type of index-based data.
|
* getItem, getItemCount, and keyExtractor to handle any type of index-based data.
|
||||||
*/
|
*/
|
||||||
data?: any,
|
data?: any,
|
||||||
|
/**
|
||||||
|
* A generic accessor for extracting an item from any sort of data blob.
|
||||||
|
*/
|
||||||
|
getItem: (data: any, index: number) => ?Item,
|
||||||
|
/**
|
||||||
|
* Determines how many items are in the data blob.
|
||||||
|
*/
|
||||||
|
getItemCount: (data: any) => number,
|
||||||
};
|
};
|
||||||
type OptionalProps = {
|
type OptionalProps = {
|
||||||
/**
|
/**
|
||||||
@ -57,14 +65,6 @@ type OptionalProps = {
|
|||||||
* `data` prop, stick it here and treat it immutably.
|
* `data` prop, stick it here and treat it immutably.
|
||||||
*/
|
*/
|
||||||
extraData?: any,
|
extraData?: any,
|
||||||
/**
|
|
||||||
* A generic accessor for extracting an item from any sort of data blob.
|
|
||||||
*/
|
|
||||||
getItem: (data: any, index: number) => ?Item,
|
|
||||||
/**
|
|
||||||
* Determines how many items are in the data blob.
|
|
||||||
*/
|
|
||||||
getItemCount: (data: any) => number,
|
|
||||||
getItemLayout?: (data: any, index: number) =>
|
getItemLayout?: (data: any, index: number) =>
|
||||||
{length: number, offset: number, index: number}, // e.g. height, y
|
{length: number, offset: number, index: number}, // e.g. height, y
|
||||||
horizontal?: ?boolean,
|
horizontal?: ?boolean,
|
||||||
@ -254,8 +254,6 @@ class VirtualizedList extends React.PureComponent<OptionalProps, Props, State> {
|
|||||||
|
|
||||||
static defaultProps = {
|
static defaultProps = {
|
||||||
disableVirtualization: false,
|
disableVirtualization: false,
|
||||||
getItem: (data: any, index: number) => data[index],
|
|
||||||
getItemCount: (data: any) => data ? data.length : 0,
|
|
||||||
horizontal: false,
|
horizontal: false,
|
||||||
initialNumToRender: 10,
|
initialNumToRender: 10,
|
||||||
keyExtractor: (item: Item, index: number) => {
|
keyExtractor: (item: Item, index: number) => {
|
||||||
|
@ -23,6 +23,8 @@ describe('VirtualizedList', () => {
|
|||||||
<VirtualizedList
|
<VirtualizedList
|
||||||
data={[{key: 'i1'}, {key: 'i2'}, {key: 'i3'}]}
|
data={[{key: 'i1'}, {key: 'i2'}, {key: 'i3'}]}
|
||||||
renderItem={({item}) => <item value={item.key} />}
|
renderItem={({item}) => <item value={item.key} />}
|
||||||
|
getItem={(data, index) => data[index]}
|
||||||
|
getItemCount={(data) => data.length}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
expect(component).toMatchSnapshot();
|
expect(component).toMatchSnapshot();
|
||||||
@ -33,6 +35,8 @@ describe('VirtualizedList', () => {
|
|||||||
<VirtualizedList
|
<VirtualizedList
|
||||||
data={[]}
|
data={[]}
|
||||||
renderItem={({item}) => <item value={item.key} />}
|
renderItem={({item}) => <item value={item.key} />}
|
||||||
|
getItem={(data, index) => data[index]}
|
||||||
|
getItemCount={(data) => data.length}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
expect(component).toMatchSnapshot();
|
expect(component).toMatchSnapshot();
|
||||||
@ -43,6 +47,8 @@ describe('VirtualizedList', () => {
|
|||||||
<VirtualizedList
|
<VirtualizedList
|
||||||
data={undefined}
|
data={undefined}
|
||||||
renderItem={({item}) => <item value={item.key} />}
|
renderItem={({item}) => <item value={item.key} />}
|
||||||
|
getItem={(data, index) => data[index]}
|
||||||
|
getItemCount={(data) => 0}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
expect(component).toMatchSnapshot();
|
expect(component).toMatchSnapshot();
|
||||||
@ -55,6 +61,8 @@ describe('VirtualizedList', () => {
|
|||||||
ListFooterComponent={() => <footer />}
|
ListFooterComponent={() => <footer />}
|
||||||
ListHeaderComponent={() => <header />}
|
ListHeaderComponent={() => <header />}
|
||||||
data={new Array(5).fill().map((_, ii) => ({id: String(ii)}))}
|
data={new Array(5).fill().map((_, ii) => ({id: String(ii)}))}
|
||||||
|
getItem={(data, index) => data[index]}
|
||||||
|
getItemCount={(data) => data.length}
|
||||||
keyExtractor={(item, index) => item.id}
|
keyExtractor={(item, index) => item.id}
|
||||||
getItemLayout={({index}) => ({length: 50, offset: index * 50})}
|
getItemLayout={({index}) => ({length: 50, offset: index * 50})}
|
||||||
refreshing={false}
|
refreshing={false}
|
||||||
@ -87,6 +95,8 @@ describe('VirtualizedList', () => {
|
|||||||
infos.push(info);
|
infos.push(info);
|
||||||
return <item title={info.item.key} />;
|
return <item title={info.item.key} />;
|
||||||
}}
|
}}
|
||||||
|
getItem={(data, index) => data[index]}
|
||||||
|
getItemCount={(data) => data.length}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
expect(component).toMatchSnapshot();
|
expect(component).toMatchSnapshot();
|
||||||
|
Loading…
x
Reference in New Issue
Block a user