Estoy tratando de desvanecer el contenido mientras lo cargo en un componente de View

Obtuve una serie de propiedades y cada cierto tiempo agrego un contador para que siga cambiando entre propiedades.

 const [counter, setCounter] = useState<number>(0) useEffect(() => { const interval = setInterval(() => { setCounter(counter => counter + 1) }, time * 1000) return () => clearInterval(interval) }, [properties])

Esto funciona bien para cambiar la propiedad, pero me gustaría agregar una animación gradual que se activa cada vez que cambia la variable del contador.

 return ( <View property={properties[counter]} /> )

Intenté agregar CSSTrasition en el componente de vista, pero solo se activa la primera vez y ya no se desvanece.

¿Cómo puedo desvanecerme cada vez que hay un cambio de propiedad?

¿Es CSSTransition el enfoque correcto? No quiero hacer clic para desvanecerme, solo quiero una breve transición de desvanecimiento entre propiedades