javascript - iOS-redux 更新不起作用在 android 中工作正常

Question

问题：Redux 更新未反映在 iOS 的 UI 中

代码

return (
  <React.Fragment>
    {this.props.children}
    {this.props.showNightOutFeedback &&
      this.props.remainderNightoutFeedbackId &&
      this.props.remainderNightoutFeedbackId.length > 0 &&
      this.props.queueingPopups &&
      this.props.queueingPopups.length > 0 &&
      this.props.queueingPopups[0].popupName ===
        queueActionTypes.ROUTE_FEEDBACK_POPUP && (
        <FeedbackRatingScreen
          routeName={
            (this.props.nightOutDetails &&
              this.props.nightOutDetails.route_name) ||
            "Feedback for Route"
          }
          routeID={this.props.remainderNightoutFeedbackId[0]}
          visible={this.props.showNightOutFeedback}
          rating={
            (this.props.nightOutDetails &&
              this.props.nightOutDetails.total_rating) ||
            0
          }
          onClose={() => {
            this.props.showNightOutFeedbackModal(false);
            this.props.deQueue();
          }}
        />
      )}

    {this.props.showVenueFeedback &&
      !isObjectEmpty(feedbackObj) &&
      this.props.queueingPopups &&
      this.props.queueingPopups.length > 0 &&
      this.props.queueingPopups[0].popupName ===
        queueActionTypes.VENUE_FEEDBACK_POPUP && (
        <FeedbackAndRatingComponent
          navigation={this.props.navigation}
          data={feedbackObj ? feedbackObj : {}}
          onClose={data => {
            this.props.showVenueFeedbackFun(false);
            this.props.updateFeedbackIsCompleted(data, true);

            if (
              this.props.remainderNightoutFeedbackId &&
              this.props.remainderNightoutFeedbackId.length
            ) {
              this.props.showNightOutFeedbackModal(true);
            }
            this.props.deQueue();
          }}
        />
      )}
    {this.props.user &&
      // this.props.showInviteScreenModal &&
      this.props.queueingPopups &&
      this.props.queueingPopups.length > 0 &&
      this.props.queueingPopups[0].popupName ===
        queueActionTypes.INVITE_SCREEN_POPUP && (
        <InviteScreen
          isInvite={this.props.queueingPopups[0].popupData.isInvite}
          inviteId={this.props.queueingPopups[0].popupData.inviteId}
          nightOutID={this.props.queueingPopups[0].popupData.nightoutId}
          navigation={this.props.navigation}
          navigateBack={this.props.navigateBack}
        />
      )}

    {this.props.user &&
      // this.props.showInviteScreenModal &&

      this.props.queueingPopups &&
      this.props.queueingPopups.length > 0 &&
      this.props.queueingPopups[0].popupName ===
        queueActionTypes.INVITATION_ALERT_POPUP && (
        <InviteScreen
          isInvite={this.props.queueingPopups[0].popupData.isInvite}
          inviteId={this.props.queueingPopups[0].popupData.inviteId}
          nightOutID={this.props.queueingPopups[0].popupData.nightoutId}
          navigation={this.props.navigation}
          navigateBack={this.props.navigateBack}
        />
      )}

    {this.props.user &&
      // this.props.showInviteScreenModal &&
      !this.props.enterRoute &&
      this.props.queueingPopups &&
      this.props.queueingPopups.length > 0 &&
      this.props.queueingPopups[0].popupName ===
        queueActionTypes.INVITATION_START_POPUP && (
        <InviteScreen
          isInvite={this.props.queueingPopups[0].popupData.isInvite}
          inviteId={this.props.queueingPopups[0].popupData.inviteId}
          nightOutID={this.props.queueingPopups[0].popupData.nightoutId}
          navigation={this.props.navigation}
          navigateBack={this.props.navigateBack}
        />
      )}
    {!this.props.venues.enterVenues &&
      //showModal.active &&
      //this.props.venues.venueDetails.venue_enter[0] != undefined &&
      (this.props.queueingPopups &&
        this.props.queueingPopups.length > 0 &&
        this.props.queueingPopups[0].popupName ===
          queueActionTypes.ENTER_VENUE_POPUP &&
        (shouldShowPopUpOrNot && (
          <EnterRoutePopup
            navigation={this.props.navigation}
            visible={true}
            isFreeRun={
              this.props.venues.venueDetails.venue_enter.length &&
              this.props.venues.venueDetails.venue_enter[0].isFreeRun
            }
            data={this.props.queueingPopups[0].popupData}
            message={""}
            onCloseModal={() => {
              showModal.active = false;
              this.props.closeModal();
            }}
            onClose={() => {
              showModal.active = false;
              this.props.closeModal();
              this.props.deQueue();
              // this.props.isPopupActiveFun(false);
            }}
          />
        )))}

    {this.props.isVenueLoading &&
      this.props.queueingPopups &&
      this.props.queueingPopups.length > 0 &&
      this.props.queueingPopups[0].popupName ===
        queueActionTypes.LOADING_VENUE &&
      VenueData.isVenueInARClicked && <LoaderPopup onClose={() => {}} />}

    {this.props.showNavigateModalPopup &&
      this.props.queueingPopups &&
      this.props.queueingPopups.length > 0 &&
      this.props.queueingPopups[0].popupName ===
        queueActionTypes.NAVIGATE_VENUE_POPUP && (
        <EnterRoutePopup
          navigation={this.props.navigation}
          visible={this.props.showNavigateModalPopup}
          isFreeRun={true}
          data={
            this.props.venueNavigateData ? this.props.venueNavigateData : {}
          }
          onClose={() => {
            this.props.showNavigateModalPopupFun(false);
            // this.props.isPopupActiveFun(false);
            this.props.deQueue();
          }}
        />
      )}
  </React.Fragment>
);

}

mapStateToProps,  mapDispatchToProps 

用于连接我的 queueReducer 。

    const popupQueuingReducer = (state = initialState, action) => {
  switch (action.type) {
    case queueActionTypes.ENQUEUE: {
      let data = [];
      data = state.queueingPopups;
      let currentQueueData = null;

      return {
        ...state,
        queueingPopups: data
      };
    }
    case queueActionTypes.PUSH: {
      let data = state.queueingPopups;
      // data.indexOf(action.data) == -1 &&
      let currentQueueData = null;
      currentQueueData = {
            popupName: action.data.popupName,
            popupData: action.data.queueData
          };
          data.unshift(currentQueueData);


      return {
        ...state,
        queueingPopups: data
      };
    }
    case queueActionTypes.REMOVE_ENTER_VENUE: {
      let data = state.queueingPopups;
      data = data.filter(function(item) {
        return item !== queueActionTypes.ENTER_VENUE_POPUP;
      });
      return {
        ...state,
        queueingPopups: data
      };
    }

    case queueActionTypes.REMOVE_LOGOUT: {
      let data = state.queueingPopups;
      data = data.filter(function(item) {
        return item !== queueActionTypes.LOGOUT;
      });
      return {
        ...state,
        queueingPopups: data
      };
    }

    case queueActionTypes.REMOVE_VENUE_LOADING: {
      let data = state.queueingPopups;
      data = data.filter(function(item) {
        return item.popupName !== queueActionTypes.LOADING_VENUE;
      });
      return {
        ...state,
        queueingPopups: data
      };
    }
    case queueActionTypes.REMOVE_PAUSE_POP_UP: {
      let data = state.queueingPopups;
      data = data.filter(function(item) {
        return item.popupName != queueActionTypes.PAUSING_POP_UPS;
      });
      return {
        ...state,
        queueingPopups: data
      };
    }

    case queueActionTypes.DEQUEUE: {
      let currentData = [];
      currentData = state.queueingPopups;
      if (currentData.length > 0) {
        currentData.shift();
      }
      // state.queueingPopups.length && state.queueingPopups.shift();

      return {
        ...state,
        queueingPopups: currentData
      };
    }

    case queueActionTypes.EMPTY_QUEUE: {
      let data = state.queueingPopups;
      data = data.filter(function(item) {
        return (
          item === queueActionTypes.PAUSING_POP_UPS ||
          item === queueActionTypes.USER_MENU_POPUP
        );
      });
      return {
        ...state,
        queueingPopups: data
      };
    }
    case queueActionTypes.RESTORE_STATE:
      console.log("action.data" + action.data);
      return {
        ...state,
        queueingPopups: action.data
      };

    default:
      return {
        ...state
      };
  }
};

export default popupQueuingReducer;

工作场景说明：

在我的 queueReducer 中向 queue(array) 添加某些警报并且一旦完成一个数组，我就会从队列中删除该项目。此更改应该在我的队列中弹出后续数组类型，因为 reducerState 的任何更改都会反映在我的 js 文件中，因为它们是通过 mapStateToProps 连接的。这在 android 中运行良好，但在 iOS 中它不是预期的行为。

这与平台或代码有关吗？

我完全困惑为什么它不起作用，因为它是简单的状态更新而不是与平台相关的东西

谁能指出我这里有什么问题？

任何帮助，将不胜感激。

提前致谢

编辑 1

道具正在商店更新。因为我可以完全确认我想要的每个警报都在我的队列中，并且每次我的队列值更改时，componentWillReceive 道具都会更新为新值。但我无法在 UI 中看到反射

编辑 2

由于@HMR 指出入队不会改变数组队列，我尝试将两个入队警报类型更改为推送，但结果相同

编辑 3

 let dataToQueue = {
  popupName: queueActionTypes.NAVIGATE_VENUE_POPUP,
  queueData: data
};
dispatch(pushQueue(dataToQueue));

上述方法用于调度我的事件

标签： javascriptreactjsreact-nativereact-reduxreact-native-ios