Аниме. Js Функция поиска не работает в React

Question

Я пытаюсь сделать анимацию с переходами при прокрутке. Мне нужно, чтобы он перевернулся при прокрутке вверх. Я знаю, что это возможно ( вот пример ), но я не могу добиться аналогичного поведения для работы в React.

Я сделал эту демонстрацию, чтобы упростить мою проблему (на основе что находится в документации Anime Js ):

const me = useRef();
const [zoom, setZoom] = useState(0);

const zoomies = anime({
  targets: me.current,
  translateY: "80vh",
  autoplay: false
});

useEffect(() => {
  zoomies.seek(zoomies.duration * (zoom / 100));
}, [zoom, zoomies]);

Это довольно просто, вы можете увидеть это в действии здесь:
https://codesandbox.io/s/animejs-react-seeking-wk09q

Как видите, он идет только вперед, а не относительно ползунка. Он также никогда не переворачивается. Я не уверен, что происходит ...

Answer 1

Мне удалось исправить свою анимацию, вы можете увидеть рабочую версию здесь:
https://codesandbox.io/s/animejs-react-seeking-h8y6m

Самое большое изменение в том, что я переместил объявление анимации в useState крючок. Я думаю, что происходило то, что анимация воссоздалась при каждом тике, поэтому не было возможности отменить ее. Но как только React узнал об этом между повторными рендерами, он просто начал работать.

Если это неправильно или неточно, пожалуйста, поправьте меня!