Rename *Component props to match SectionList
Reviewed By: yungsters Differential Revision: D4697335 fbshipit-source-id: 742b7a1729ba7a08fe3d9707bcf6c51026779739
This commit is contained in:
Родитель
ac452c0a17
Коммит
3ce31c24da
|
@ -133,9 +133,9 @@ class FlatListExample extends React.PureComponent {
|
|||
</View>
|
||||
<SeparatorComponent />
|
||||
<AnimatedFlatList
|
||||
HeaderComponent={HeaderComponent}
|
||||
FooterComponent={FooterComponent}
|
||||
SeparatorComponent={SeparatorComponent}
|
||||
ItemSeparatorComponent={SeparatorComponent}
|
||||
ListHeaderComponent={HeaderComponent}
|
||||
ListFooterComponent={FooterComponent}
|
||||
data={filteredData}
|
||||
debug={this.state.debug}
|
||||
disableVirtualization={!this.state.virtualized}
|
||||
|
|
|
@ -97,9 +97,9 @@ class MultiColumnExample extends React.PureComponent {
|
|||
</View>
|
||||
<SeparatorComponent />
|
||||
<FlatList
|
||||
FooterComponent={FooterComponent}
|
||||
HeaderComponent={HeaderComponent}
|
||||
SeparatorComponent={SeparatorComponent}
|
||||
ItemSeparatorComponent={SeparatorComponent}
|
||||
ListFooterComponent={FooterComponent}
|
||||
ListHeaderComponent={HeaderComponent}
|
||||
getItemLayout={this.state.fixedHeight ? this._getItemLayout : undefined}
|
||||
data={filteredData}
|
||||
key={this.state.numColumns + (this.state.fixedHeight ? 'f' : 'v')}
|
||||
|
|
|
@ -66,18 +66,18 @@ type RequiredProps<ItemT> = {
|
|||
data: ?Array<ItemT>,
|
||||
};
|
||||
type OptionalProps<ItemT> = {
|
||||
/**
|
||||
* Rendered in between each item, but not at the top or bottom.
|
||||
*/
|
||||
ItemSeparatorComponent?: ?ReactClass<any>,
|
||||
/**
|
||||
* Rendered at the bottom of all the items.
|
||||
*/
|
||||
FooterComponent?: ?ReactClass<any>,
|
||||
ListFooterComponent?: ?ReactClass<any>,
|
||||
/**
|
||||
* Rendered at the top of all the items.
|
||||
*/
|
||||
HeaderComponent?: ?ReactClass<any>,
|
||||
/**
|
||||
* Rendered in between each item, but not at the top or bottom.
|
||||
*/
|
||||
SeparatorComponent?: ?ReactClass<any>,
|
||||
ListHeaderComponent?: ?ReactClass<any>,
|
||||
/**
|
||||
* `getItemLayout` is an optional optimizations that let us skip measurement of dynamic content if
|
||||
* you know the height of items a priori. `getItemLayout` is the most efficient, and is easy to
|
||||
|
@ -88,7 +88,7 @@ type OptionalProps<ItemT> = {
|
|||
* )}
|
||||
*
|
||||
* Remember to include separator length (height or width) in your offset calculation if you
|
||||
* specify `SeparatorComponent`.
|
||||
* specify `ItemSeparatorComponent`.
|
||||
*/
|
||||
getItemLayout?: (data: ?Array<ItemT>, index: number) =>
|
||||
{length: number, offset: number, index: number},
|
||||
|
@ -132,13 +132,6 @@ type OptionalProps<ItemT> = {
|
|||
* Optional custom style for multi-item rows generated when numColumns > 1
|
||||
*/
|
||||
columnWrapperStyle?: StyleObj,
|
||||
/**
|
||||
* Optional optimization to minimize re-rendering items.
|
||||
*/
|
||||
shouldItemUpdate: (
|
||||
prevInfo: {item: ItemT, index: number},
|
||||
nextInfo: {item: ItemT, index: number}
|
||||
) => boolean,
|
||||
/**
|
||||
* See `ViewabilityHelper` for flow type and further documentation.
|
||||
*/
|
||||
|
|
|
@ -183,16 +183,8 @@ class SectionList<SectionT: SectionBase<any>>
|
|||
static defaultProps: DefaultProps = VirtualizedSectionList.defaultProps;
|
||||
|
||||
render() {
|
||||
const {ListFooterComponent, ListHeaderComponent, ItemSeparatorComponent} = this.props;
|
||||
const List = this.props.legacyImplementation ? MetroListView : VirtualizedSectionList;
|
||||
return (
|
||||
<List
|
||||
{...this.props}
|
||||
FooterComponent={ListFooterComponent}
|
||||
HeaderComponent={ListHeaderComponent}
|
||||
SeparatorComponent={ItemSeparatorComponent}
|
||||
/>
|
||||
);
|
||||
return <List {...this.props} />;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -59,9 +59,6 @@ type RequiredProps = {
|
|||
data?: any,
|
||||
};
|
||||
type OptionalProps = {
|
||||
FooterComponent?: ?ReactClass<any>,
|
||||
HeaderComponent?: ?ReactClass<any>,
|
||||
SeparatorComponent?: ?ReactClass<any>,
|
||||
/**
|
||||
* `debug` will turn on extra logging and visual overlays to aid with debugging both usage and
|
||||
* implementation, but with a significant perf hit.
|
||||
|
@ -305,6 +302,7 @@ class VirtualizedList extends React.PureComponent<OptionalProps, Props, State> {
|
|||
'Components based on VirtualizedList must be wrapped with Animated.createAnimatedComponent ' +
|
||||
'to support native onScroll events with useNativeDriver',
|
||||
);
|
||||
|
||||
this._updateCellsToRenderBatcher = new Batchinator(
|
||||
this._updateCellsToRender,
|
||||
this.props.updateCellsBatchingPeriod,
|
||||
|
@ -334,7 +332,7 @@ class VirtualizedList extends React.PureComponent<OptionalProps, Props, State> {
|
|||
}
|
||||
|
||||
_pushCells(cells, first, last) {
|
||||
const {SeparatorComponent, data, getItem, getItemCount, keyExtractor} = this.props;
|
||||
const {ItemSeparatorComponent, data, getItem, getItemCount, keyExtractor} = this.props;
|
||||
const end = getItemCount(data) - 1;
|
||||
last = Math.min(end, last);
|
||||
for (let ii = first; ii <= last; ii++) {
|
||||
|
@ -352,19 +350,19 @@ class VirtualizedList extends React.PureComponent<OptionalProps, Props, State> {
|
|||
parentProps={this.props}
|
||||
/>
|
||||
);
|
||||
if (SeparatorComponent && ii < end) {
|
||||
cells.push(<SeparatorComponent key={'sep' + ii}/>);
|
||||
if (ItemSeparatorComponent && ii < end) {
|
||||
cells.push(<ItemSeparatorComponent key={'sep' + ii}/>);
|
||||
}
|
||||
}
|
||||
}
|
||||
render() {
|
||||
const {FooterComponent, HeaderComponent} = this.props;
|
||||
const {ListFooterComponent, ListHeaderComponent} = this.props;
|
||||
const {data, disableVirtualization, horizontal} = this.props;
|
||||
const cells = [];
|
||||
if (HeaderComponent) {
|
||||
if (ListHeaderComponent) {
|
||||
cells.push(
|
||||
<View key="$header" onLayout={this._onLayoutHeader}>
|
||||
<HeaderComponent />
|
||||
<ListHeaderComponent />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
@ -404,10 +402,10 @@ class VirtualizedList extends React.PureComponent<OptionalProps, Props, State> {
|
|||
);
|
||||
}
|
||||
}
|
||||
if (FooterComponent) {
|
||||
if (ListFooterComponent) {
|
||||
cells.push(
|
||||
<View key="$footer" onLayout={this._onLayoutFooter}>
|
||||
<FooterComponent />
|
||||
<ListFooterComponent />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -84,7 +84,7 @@ type OptionalProps<SectionT: SectionBase> = {
|
|||
renderSectionHeader?: ?({section: SectionT}) => ?React.Element<*>,
|
||||
/**
|
||||
* Rendered at the bottom of every Section, except the very last one, in place of the normal
|
||||
* SeparatorComponent.
|
||||
* ItemSeparatorComponent.
|
||||
*/
|
||||
SectionSeparatorComponent?: ?ReactClass<*>,
|
||||
/**
|
||||
|
|
Загрузка…
Ссылка в новой задаче