2 ms·
A pretty straightforward pattern here (and one that I actually just implemented with no hiccups for a non-React animation library) looks like: import { use
by crooked-v 5y ago
A pretty straightforward pattern here (and one that I actually just implemented with no hiccups for a non-React animation library) looks like:
import { useEffect, useRef } from 'react';
import { Controller } from 'some-animation-library';
const SomeWrapperComponent = ({ options }) => {
const elementRef = useRef(null)
const controllerRef = useRef(null)
useEffect(() => {
if (!elementRef.current) {
return () => {}
}
if (!controllerRef.current) {
controllerRef.current = new Controller(elementRef.current, options)
} else {
controllerRef.current.setOptions(options)
}
return () => {
controllerRef.current.doSomeCleanup()
}
}, [options])
return <div ref={elementRef}></div>
}
- crate_barre 5y agoThanks, that’s exactly the simplicity I wanted you to share, you did good.