react-native-reanimated - useAnimatedStyle 返回的样式常量导致应用停止工作
问题描述
我在 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
解决方案
推荐阅读
- entity-framework-core - 实体框架:是否有多个 dbcontext?以及其他一些与性能相关的问题
- c++ - (C++) Leetcode:为什么我的代码比示例顶级解决方案慢这么多?(547. 省数)
- javascript - 不同的用户 ID [discord.js]
- javascript - 如何使用 Chrome 扩展程序关闭当前的 Chrome 选项卡?
- swift - 如何检查字符串是否是 Swift 5 中的日期?
- c++ - 检测扫描图像所属的相机
- yosys - 如何使用标准单元库估算芯片尺寸
- javascript - React 无法识别 Parallax.js
- c - 如何摆脱递归?C 编程
- typescript - Typescript:将函数输入类型与 Array.reduce 函数中的输出类型匹配