useListTransition 初始化key

[muyeyong]

如果像这样使用useListTransition(list, **300)
const keyRef = useRef(0); // change list to our list form with extra information. const initialList: Array<ItemWithState<Item>> = list.map((item, key) => ({ item, key: keyRef.current, stage: 'enter', }));
会导致key重复

[iamyoki]

Thank you. The useListTransition api hasn't been officially released, but it's apparently exists in the library, it's still in designing progress and will come with transition-hook v2, stay tuned~

[Imfahrenheit]

@iamyoki I was looking for an example image slider or carousel using your lib. So far I could not manage to produce something usable.

[iamyoki]

@Imfahrenheit Could you produce a codesandbox example of your carousel? I would complete it for you.

[Imfahrenheit]

@iamyoki Thanks for the prompt response! I quickly created a codesandbox for you to give me some pointers. The carousel should slide left or right based on prev or next direction.

[iamyoki]

@Imfahrenheit Take a look https://codesandbox.io/s/transition-hook-experiement-complete-boo32y?file=/src/Slider.tsx

[Imfahrenheit]

@Imfahrenheit Take a look https://codesandbox.io/s/transition-hook-experiement-complete-boo32y?file=/src/Slider.tsx

perfect! Thanks a lot, now I don't need to use react-transition-group for this.