如何使用挂钩进行动画制作？

Question

大家好，我正在尝试使用Hooks和功能组件制作动画 它按预期工作正常，但我与代码相关的困惑很少

让我解释一下

const [ProgressAnimation] = useState(new Animated.Value(0));
const [progress, setProgress] = useState(0); 

使用它来存储动画值

React.useEffect(() => {
    Animated.timing(ProgressAnimation, {
      toValue: progress,
      duration: 500,
    }).start();
  });

使用效果来处理更新进度条，因此progress是每500毫秒更新一次的本地状态

const animatedWidth = ProgressAnimation.interpolate({
    inputRange: [0, totalProgress],
    outputRange: ['0%', '100%'],
  });

我的问题是progress的值设置为500毫秒，因此我每执行500毫秒就会渲染一次，这是我做对的事情或需要更改流程

对不起，我的英语。