React native 如何向React Native中的元素添加过渡动画

我有一个箭头图标，如下所示：

<View style={[styles.icon, dropdownOpen && {transform: [{rotate: '180deg'}] }]}>
   <Icon name="arrow-down" size={20} color="#444"}>
</View>

这个状态是由另一个组件驱动的，它工作得很好，但当然没有转换

我知道我可以使用动画API，但我不知道怎么做

---

我想我应该在

视图中使用
Animated.View
，但是我应该把
Animated.Value
放在哪里呢？
看起来你在使用钩子。您可以对动画值使用useReft，然后在useffect中可以触发动画值，如下所示：


const[dropdownOpen，setDropdownOpen]=useState（false）；
常量animatedIconRotation=useRef（新的Animated.Value（0））.current；
useffect（（）=>{
已设置动画。计时（animateDictionRotation{
持续时间：100，
放松：放松，线性，
toValue:dropdownOpen？180:0，
useNativeDriver：没错，
}).start（）；
}，[dropdownOpen]）谢谢您的回答，但是尝试了，没有成功。尝试使用useffect部分，只保留useref声明，例如，将起始值更改为50，但它根本没有旋转，然而，控制台日志记录它记录了50 si值。还尝试删除useRef并仅声明值，从而旋转视图。因此，旋转正在工作，但我正在失去接触，记录
animatedIconRotation
记录一个对象，我解决了它！我必须使用插值才能使其工作，因此我将动画从0设置为1，并将插值从“0度”设置为“180度”
const [dropdownOpen, setDropdownOpen] = useState(false);