javascript - 在 React Native 渲染文本组件中显示动画值
问题描述
我无法在渲染上显示 Animated 的值并返回此错误。
Invariant Violation:对象作为 React 子级无效(发现:带有键 {value} 的对象)。如果您打算渲染一组子项,请改用数组。
当然,我看到了价值console
constructor(props) {
super(props);
this.state={
progress:0
}
this.animatedValue = new Animated.Value(0);
this.animatedValue.addListener((progress) => {
this.setState({progress})
});
}
componentDidMount() {
this.animate()
}
animate() {
this.animatedValue.setValue(0);
Animated.timing(
this.animatedValue,
{
toValue: 1,
duration: 15000,
easing: Easing.linear
}
).start()
}
render() {
return(
<View>
<Text> {this.state.progress} </Text>
</View>
);
}
解决方案
给定的函数addListener
将使用带有value
键作为参数的对象调用,因此不要progress
使用整个对象进行设置,value
而是使用:
this.animatedValue.addListener((progress) => {
this.setState({ progress: progress.value });
});
推荐阅读
- python - numpy RuntimeError 异常
- python - Pandas Python用第一个单元格中的相同值替换值
- arrays - 如何在 minizinc 中表示二维空间中的一个点?
- javascript - 对下拉列表进行排序
- python - __all__ 在特定文件中的用法
- c - 我怎样才能在OK之前添加消息?
- javascript - 将注册表单发送到 php 并通过 javascript 进行验证
- arrays - 数组数组的运行时数组赋值
- python - 什么 python 内置函数可以将一些函数应用于列表的每个元素?
- sql - 如何加入这些表以从客户那里获得独特的产品描述?