我在 React Native 0.64 应用程序中有一个简单的 Accordion 组件,使用react-native-reanimated 2.1.0
. 动画 var 定义为animatedVar
. 以下是相关代码:
const aref = useAnimatedRef();
const open = useSharedValue(false);
const animatedVar = useDerivedValue(() => {open.value ? withTiming(1) : withTiming(0)});
const height = useSharedValue(0);
const accordStyle = useAnimatedStyle(() => { //<<== accordStyle causes app stopping working
return {
height: height.value * animatedVar.value + 1,
opacity: animatedVar.value === 0 ? 0 : 1,
};
});
const pressAccord = async () => {
if (height.value === 0) {
runOnUI(() => {
"worklet";
height.value = measure(aref).height;
})();
}
open.value = !open.value;
};
return (
<>
<TouchableOpacity onPress={() => pressAccord()}>
<View style={styles.titleContainer}>
<Text>{title}</Text>
<Animated.View style={iconStyle}>
<Icon name="chevron-down-outline" size={20} />
</Animated.View>
</View>
</TouchableOpacity>
<Animated.View style={[accordStyle]} > //<<==accordStyle causes app stop working
<View ref={aref} >
{children}
</View>
</Animated.View>
</>
);
如果accordStyle
从上面的代码中删除,则手风琴工作正常(我的意思是没有错误)。但app stopped working
如果accordStyle
包含在style
. 但我无法弄清楚有什么问题accordStyle