react-native - React Native 动画只有在使用 useEffect 的 state 为真时才有效

Question

我正在尝试使用动画 api 和 useEffect 钩子制作手风琴组件，但动画只有在展开状态为真时才有效。当展开状态 false 组件会自行关闭但没有动画。我怎样才能让这个动画在两种状态下都工作？

const [expanded, setExpanded] = useState(false);
useEffect(() => {
        console.log(expanded ? "150" : "0",);
        Animated.parallel([
            Animated.timing(animatedBGColor, {
                toValue: expanded ? 150 : 0,
                easing: Easing.linear,
                duration: 200,
            }),
            Animated.spring(animatedRotation, {
                toValue: expanded ? 1 : 0,
                tension: 100,
                friction: 9,
            }),
            Animated.timing(animatedHeight, {
                toValue: expanded ?  (lineHeight + (scaleHeight(15) * 2)) : 0,
                easing: Easing.linear,
                duration: 200,
            }),
            Animated.timing(animatedMargin, {
                toValue: expanded ? scaleHeight(15) : 0,
                duration: 200,
            })
        ]).start()
    }, [expanded]);

我正在用这个按钮改变状态

<AnimatedTouchable onPress={() => setExpanded(!expanded)}