无法将 React Native 动画值设置为视图组件 CSS 样式

Question

我正在尝试使 View 组件样式具有动画效果。我正在按照此处列出的示例进行操作：https://facebook.github.io/react-native/docs/animations.html

但是，当我渲染我的组件时，出现错误：

[tid:com.facebook.React.ShadowQueue][RCTConvert.m:55] Error setting property 'height' of RCTView with tag #7: JSON value '{ "_animation" = ""; "_children" = ( ); "_listeners" = { }; "_offset" = 0; "_value" = 200; }' of type NSDictionary cannot be converted to NSNumber

这就是我在构造函数中设置动画值的方式：

  constructor() {
    super();
    this.state = {
      titleContainerHeight: new Animated.Value(200),
    }
  }

这是我的观点：

<View style={[styles.titleContainer,{height:this.state.titleContainerHeight}]}>
  <Text style={[{color: 'white'}]}>App logo here</Text>
</View>

似乎我正在按照文档描述的方式进行所有操作，并且我在另一个组件中做同样的事情而没有出现任何错误。那么，这里出了什么问题？

Answer 1

啊没关系，我发现我做错了什么。我忘了具体使用 "Animated.View" 组件。这有效：

<Animated.View style={[styles.titleContainer,{height:this.state.titleContainerHeight}]}>
  <Text style={[{color: 'white'}]}>App logo here</Text>
</Animated.View>

无法将 React Native 动画值设置为视图组件 CSS 样式

Cannot set React Native Animated value to View component CSS style

animation

view

animated

react-native