react-hooks icon indicating copy to clipboard operation
react-hooks copied to clipboard

Add a computed array hook

Open otakustay opened this issue 3 years ago • 0 comments

在某些时候,我们已经有了一个数组,但要对这个数组做额外的修改(对应derivedState),但当这个原始数组变化时,我们的额外修改还要保持住。

场景一:

有一个列表,并且可以新增条目,新增的条目会临时放在列表的最上方向。无论列表是否切换页码、排序,新增条目要保持。

场景二:

在无限滚动加载的列表中,删除了某些项,此时再滚动增加新内容后,要依然保持删除的项不会出现。

这种情况下,useDerivedState是没法用的,因为原始数组变化(翻页、新加载内容)后,就会变成新的数组,原来的新增、删除等操作都没了

所以我们需要一个useComputedArray,基于一个原始数组,并在内部以“操作”的形式记录对它的修改,无论原始数组怎么变,都可以把“操作”覆盖上去保留

otakustay avatar Apr 10 '21 05:04 otakustay