Как перерендерить компонент вместо вызова конструктора?

У меня есть FlatList с элементами с индикаторами выполнения, и я хочу изменить ход выполнения одного элемента. Для индикатора выполнения я сделал собственный компонент. Но каждый раз, когда я меняю ход выполнения одного элемента, он повторно рендерится, но компонент не рендерится повторно, вместо этого вызывается конструктор. Это проблематично из-за анимации прогресса.

Я попытался добавить такие функции, как componentWillReceiveProps и componentWillUpdate, но они не вызываются.

Предмет:

<View style = {styles.node}>
  <PercentageBar value = {item.progress} />
</View>

Компонент:

  constructor(props) {
    super(props);
    this.state = {
      animHeight: new Animated.Value(this.props.value),
    };
  }

  componentDidMount() {
    Animated.timing(this.state.animHeight,
      {
        toValue: this.props.value,
        duration: 200,
      }
    ).start();
  }

<View style = {styles.background}>
  <Animated.View style = {{height: this.state.animHeight.interpolate({
            inputRange: [0, 1],
            outputRange: ['0%', '100%'],
          }}></Animated.View>
</View>

Вместо вызова конструктора и сброса компонента я хочу, чтобы он повторно отображался с новыми реквизитами.