React Native Progress View iOS Не Rerender

Question

Я создаю приложение в React Native & REDUX. Я использую Progress View iOS в React Native, чтобы показать очень простой собственный индикатор выполнения. Вот код:

renderProgressBar() { 
    if(!!Platform.OS) { 
     switch(Platform.OS) { 
      case 'ios': 
       return (
        <ProgressViewIOS 
         progress={(this.props.backgroundData.percentageLoaded || 0)} 
         progressTintColor={globalProgressBarTintColor} 
         trackTintColor={globalProgressBarEmptyTrackTintColor} /> 
       ); 

      case 'android': 
       return (
        <ProgressBarAndroid 
         color={globalProgressBarTintColor} 
         progress={(this.props.backgroundData.percentageLoaded || 0)} /> 
       ); 

      default: 
       return null; 
     } 

    } else { 
     return null; 
    } 
} 

Я сделал паузу приложения в его REDUX контейнера, а также в этом методе визуализации самого зрения, и я 100% уверен, что все значения хода работы его в порядке. Они появляются из редуктора в моем контейнере, который передается в точку зрения. Они отображаются во всех методах визуализации. Они равны 0, 0.2, 0.4, 0.666666601, 0.8 и 1.

Так что я говорю, что this.props.backgroundData.percentageLoaded будет равняться этим значениям, которые я только что упомянул. Я могу приостановить его и увидеть, что значение, безусловно, есть, и это число не строка, поэтому все должно быть хорошо. По какой-то причине, хотя он делает 5 раз, ничего не появляется.

Это не за чем-то другим (говорящий UI-стек мудрый), потому что я установил значение прогресса в 1 и установил цвета на красный и синий на панели, и он отобразился нормально. Если я сохраню эти сумасшедшие красно-синие цвета и задаю ход всем тем значениям, о которых я упоминал выше, все они работают индивидуально (жестко закодировано не динамическое значение prop).

В случае, если кто-то хочет знать только Реагировать Native метод жизненного цикла я использую это делают, и это выглядит следующим образом:

render() { 
    this.titleWidth = this.props.deviceWidth/2; 

    return (
     <View> 
      <View style={[ 
          styles.navbar, 
          { 
           width: this.props.deviceWidth, 
           justifyContent: (this.props.showBackIcon === false && this.props.showingTitle === false) ? 'flex-end' : 'space-between', 
          } 
         ]}> 

       { this.props.showBackIcon ? this.renderBackButton() : null } 

       { this.props.showingTitle ? this.renderTitle() : null } 

       { this.props.showingIcon ? this.renderRightIconButton() : null } 

       { this.props.showingTextButton ? this.renderRightTextButton() : null } 

      </View> 

      { this.renderProgressBar() } 
     </View> 
    ); 
} 

Я тупик. Мысли кто-нибудь? Благодарю.

Edit: Кроме того, упаковывают это помогает, вот код контейнера посылается в качестве реквизита:

const mapStateToProps = (state, props) => { 
    return { 
     ...safelyBuildPassProps(state.navigation.route.passProps), 
     deviceHeight: state.appSettings.deviceOrientation.currDeviceHeight, 
     deviceWidth: state.appSettings.deviceOrientation.currDeviceWidth, 
     backgroundData: { 
      loadingData: state.appSettings.loadingBackgroundData, 
      percentageLoaded: state.appSettings.loadingBackgroundDataPercent, 
     }, 
    } 
} 

Второй Edit

я должен объяснить более, что все это основано на вызовы и преобразования ASync. Все процессы происходят в клиенте (устройствах) и процессы таковы:

• Сделать вызов бакэнд с выборкой
• Получить объект ответа со статусом успеха и отправить моделирование службу
• Modeling сервис (который является локальной функцией ASync) очищает объект ответа и преобразуется в правильные результаты пользовательского интерфейса с цветами и whatnot
• После итерации по массиву объектов ответа разделите 100 на длину массива, а затем снова на 100, чтобы получить десятичное значение для ProgressViewIOS использовать.
• Отправляйте проценты сразу после завершения преобразований по каждому объекту
• Отправка звонков на ретранслятор на навигационной панели, где находится индикатор выполнения, и передает ему новый процент, как показано в приведенном выше коде.
• засавить происходит (я замолчала его здесь, чтобы увидеть его возвращение надлежащего объекта JSX и проценты), но ничего на экране изменяется в устройстве

Answer 1

Проблема здесь в том, что я пытался обновить прогресс бар о 20 раз меньше, чем за секунду. Замечательно иметь индикатор выполнения, чтобы увидеть прогресс в хрусте данных, однако ... если вся трансформация происходит в течение секунды ...вам, вероятно, не требуется индикатор выполнения.

Как только я добавил больше времени там, индикатор выполнения успел обновиться просто отлично.