Open
Description
If you have a transition like this:
const [phase, setPhase] = useState(1)
const transition = useSwitchTransition(phase, 300, 'out-in');
and you quickly cycle form 1 -> 2 -> 1:
setPhase(2);
setPhase(1);
the output of the stage in the transition callback will be 1, leave
{transition((state, stage) => (
/* stage will be equal to 'leave' */
...
Current workaround is to add a random number to phase:
export const setFormattedPhase = (phase) => {
return ${phase}_${Math.random()}
;
};
export const getFormattedPhase = (stage?: phase) => {
return Number(phase?.split('_')[0]);
};
then
const [phase, setPhase] = useState(1)
const transition = useSwitchTransition(setFormattedPhase(phase), 300, 'out-in');
...
setPhase(2);
setPhase(1);
To me it seems like a key issue, and transition-hook is just reusing a component that was not finished unmounting, but kept the stage
Metadata
Assignees
Labels
No labels