add shouldForceUpdate to resetAfterIndex

This commit is contained in:
Neo
2018-08-02 11:22:18 +08:00
parent 4c2f39365b
commit b49bab680e
6 changed files with 109 additions and 43 deletions
+16 -5
View File
@@ -396,20 +396,28 @@ const VariableSizeGrid = createGridComponent({
rowMetadataMap: {},
};
instance.resetAfterColumnIndex = (columnIndex: number) => {
this.resetAfterIndices({ columnIndex });
instance.resetAfterColumnIndex = (
columnIndex: number,
shouldForceUpdate?: boolean = true
) => {
this.resetAfterIndices({ columnIndex, shouldForceUpdate });
};
instance.resetAfterRowIndex = (rowIndex: number) => {
this.resetAfterIndices({ rowIndex });
instance.resetAfterRowIndex = (
rowIndex: number,
shouldForceUpdate?: boolean = true
) => {
this.resetAfterIndices({ rowIndex, shouldForceUpdate });
};
instance.resetAfterIndices = ({
columnIndex,
rowIndex,
shouldForceUpdate = true,
}: {
columnIndex?: number,
rowIndex?: number,
shouldForceUpdate?: boolean,
}) => {
if (typeof columnIndex === 'number') {
instanceProps.lastMeasuredColumnIndex = Math.min(
@@ -429,7 +437,10 @@ const VariableSizeGrid = createGridComponent({
// It seems an unnecessary optimization.
// It's unlikely that resetAfterIndex() will be called while a user is scrolling.
instance._itemStyleCache = {};
instance.forceUpdate();
if (shouldForceUpdate) {
instance.forceUpdate();
}
};
return instanceProps;
+8 -2
View File
@@ -251,7 +251,10 @@ const VariableSizeList = createListComponent({
lastMeasuredIndex: -1,
};
instance.resetAfterIndex = (index: number) => {
instance.resetAfterIndex = (
index: number,
shouldForceUpdate?: boolean = true
) => {
instanceProps.lastMeasuredIndex = Math.min(
instanceProps.lastMeasuredIndex,
index - 1
@@ -262,7 +265,10 @@ const VariableSizeList = createListComponent({
// It seems an unnecessary optimization.
// It's unlikely that resetAfterIndex() will be called while a user is scrolling.
instance._itemStyleCache = {};
instance.forceUpdate();
if (shouldForceUpdate) {
instance.forceUpdate();
}
};
return instanceProps;
+13
View File
@@ -206,6 +206,19 @@ describe('VariableSizeGrid', () => {
});
describe('resetAfterIndex method', () => {
it('should not call forceUpdate if shouldForceUpdate is false', () => {
const rendered = ReactTestRenderer.create(
<VariableSizeGrid {...defaultProps} />
);
rendered.getInstance().forceUpdate = jest.fn();
rendered.getInstance().resetAfterIndices({
columnIndex: 5,
rowIndex: 15,
shouldForceUpdate: false,
});
expect(rendered.getInstance().forceUpdate).toHaveBeenCalledTimes(0);
});
it('should recalculate the estimated total size', () => {
const columnWidth = jest.fn(() => 75);
const rowHeight = jest.fn(() => 35);
+9
View File
@@ -168,6 +168,15 @@ describe('VariableSizeList', () => {
});
describe('resetAfterIndex method', () => {
it('should not call forceUpdate if shouldForceUpdate is false', () => {
const rendered = ReactTestRenderer.create(
<VariableSizeList {...defaultProps} />
);
rendered.getInstance().forceUpdate = jest.fn();
rendered.getInstance().resetAfterIndex(15, false);
expect(rendered.getInstance().forceUpdate).toHaveBeenCalledTimes(0);
});
it('should recalculate the estimated total size', () => {
const itemSize = jest.fn(() => 75);
const rendered = ReactTestRenderer.create(
+48 -28
View File
@@ -96,39 +96,59 @@ const PROPS = [
const METHODS = [
{
description: (
<p>
<code>VariableSizeGrid</code> caches offsets and measurements for each
column index for performance purposes. This method clears that cached
data for all columns after (and including) the specified index. It
should be called whenever a column's width changes. (Note that this is
not a typical occurrance.)
</p>
),
signature: 'resetAfterColumnIndex(index: number): void',
},
{
description: (
<p>
<code>VariableSizeGrid</code> caches offsets and measurements for each
item for performance purposes. This method clears that cached data for
all items after (and including) the specified indices. It should be
called whenever an items size changes. (Note that this is not a typical
occurrance.)
</p>
<Fragment>
<p>
<code>VariableSizeGrid</code> caches offsets and measurements for each
column index for performance purposes. This method clears that cached
data for all columns after (and including) the specified index. It
should be called whenever a column's width changes. (Note that this is
not a typical occurrance.)
</p>
<p>
You can set <code>shouldForceUpdate</code> to <code>false</code>
to prevent the list calling <code>forceUpdate</code> internally.
</p>
</Fragment>
),
signature:
'resetAfterIndices({ columnIndex: number, rowIndex: number }): void',
'resetAfterColumnIndex(index: number, shouldForceUpdate: boolean = true): void',
},
{
description: (
<p>
<code>VariableSizeGrid</code> caches offsets and measurements for each
row index for performance purposes. This method clears that cached data
for all rows after (and including) the specified index. It should be
called whenever a row's height changes. (Note that this is not a typical
occurrance.)
</p>
<Fragment>
<p>
<code>VariableSizeGrid</code> caches offsets and measurements for each
item for performance purposes. This method clears that cached data for
all items after (and including) the specified indices. It should be
called whenever an items size changes. (Note that this is not a
typical occurrance.)
</p>
<p>
You can set <code>shouldForceUpdate</code> to <code>false</code>
to prevent the list calling <code>forceUpdate</code> internally.
</p>
</Fragment>
),
signature: 'resetAfterRowIndex(index: number): void',
signature:
'resetAfterIndices({ columnIndex: number, rowIndex: number, shouldForceUpdate: boolean = true }): void',
},
{
description: (
<Fragment>
<p>
<code>VariableSizeGrid</code> caches offsets and measurements for each
row index for performance purposes. This method clears that cached
data for all rows after (and including) the specified index. It should
be called whenever a row's height changes. (Note that this is not a
typical occurrance.)
</p>
<p>
You can set <code>shouldForceUpdate</code> to <code>false</code>
to prevent the list calling <code>forceUpdate</code> internally.
</p>
</Fragment>
),
signature:
'resetAfterRowIndex(index: number, shouldForceUpdate: boolean = true): void',
},
];
+15 -8
View File
@@ -74,14 +74,21 @@ const PROPS = [
const METHODS = [
{
description: (
<p>
<code>VariableSizeList</code> caches offsets and measurements for each
index for performance purposes. This method clears that cached data for
all items after (and including) the specified index. It should be called
whenever a item's size changes. (Note that this is not a typical
occurrance.)
</p>
<Fragment>
<p>
<code>VariableSizeList</code> caches offsets and measurements for each
index for performance purposes. This method clears that cached data
for all items after (and including) the specified index. It should be
called whenever a item's size changes. (Note that this is not a
typical occurrance.)
</p>
<p>
You can set <code>shouldForceUpdate</code> to <code>false</code>
to prevent the list calling <code>forceUpdate</code> internally.
</p>
</Fragment>
),
signature: 'resetAfterIndex(index: number): void',
signature:
'resetAfterIndex(index: number, shouldForceUpdate: boolean = true): void',
},
];