React Native 分页和 React 导航问题答案

【问题标题】：React Native Pagination and React Navigation ProblemReact Native 分页和 React 导航问题
【发布时间】：2020-01-06 06:51:30
【问题描述】：

由于分页和 React Native Navigation，我面临着复杂类型的问题。抽屉有点击类别列表，它们都将进入屏幕

问题陈述：

当我随机点击类别时，一切正常。但是，在分页期间遇到问题。假设我单击类别 Consumer 并滚动查看更多记录。之后，我点击 Mobile 类别。移动类别页面将显示一秒钟，然后调用之前的路线（消费者）。

我尝试使用以下代码导航类别，但遇到了同样的问题。

代码：

1).

this.props.navigation.navigate({
  routeName: "CategoryList",
  params: {
    cat_id: e.cat_id
  },
  key: Math.random () * 10000
})

2).

const resetAction = StackActions.reset({
  index: 0,
  actions: [NavigationActions.navigate({
    routeName: 'CategoryList',
    params: {
      cat_id: e.cat_id
    }
  })],
});
this.props.navigation.dispatch(resetAction);

3).

const pushAction = StackActions.push({
  routeName: "CategoryList",
  params: {
    cat_id: e.cat_id
  }
});
this.props.navigation.dispatch(pushAction);

【问题讨论】：

没明白你的意思。你能用更多细节或视频解释一下吗？
@KishanVaghela 简单来说，当我在加载新产品后单击加载更多产品时，我会导航到其他类别，例如移动的。页面重定向 2 次，1 显示正确的移动类别，但突然重定向到上一个类别页面，例如localhost/category/1?page_no=2 但它应该加载localhost/category/5 的页面，而不是之前的分页记录localhost/category/1?page_no=2。我希望这是有道理的。
我觉得另外一部分有问题，不是导航。
仍然添加视频可能会有所帮助。
@AshwinMothilal 我无法添加视频。根据我的公司，这是非法的。很抱歉我无法分享视频。

标签： react-native react-navigation

【解决方案1】：

在 categoryList 页面中显示旧项目，因为我们的 redux 存储中有旧记录，所以我们需要自己分配空数组。所以，当我们调用页面时，我们自己分配空数组。

componentWillMount = () => {
this.props.categoryListRecord.categoryList = []
}

mapStateToProps = (state) => { ....
categoryListRecord : state.categoryListReducer

然后我们可以调度我们的操作并获取新记录并在我们的组件中使用它。解决这个错误

【讨论】：