首页猜你喜欢加载次数多于3次

Question

老师，您好。有个疑问我思考了很久，都没有想到答案，向您请教一下。

8-11 redux状态管理：首页连接redux  这一课里，向上拖动LikeList，就加载更多的数据，这个刷新的次数，课程里是设置了3次。可我经常刷出超过3次（4-9次不等）的数据。我直接把您的代码拷贝到我的项目里，还是会刷出N次数据（N>3）。我仔细把数据流程梳理了很多遍，都没发现问题原因。您可以帮我讲一下吗？

这个刷出超过3次的问题，我貌似解决了，修改了一下代码。

我没有用store里面的pageCount来作为刷新次数的依据，而是在LikeList这个组件里设置了一个likeListCount，来记录刷新数据的次数。改动的部分如下：

您可否看下逻辑是否是对的。

Answer 1

艾特老干部 2020-12-20 17:46:00

你好。你的写法功能上是可以跑通的，但是最好把likeListCount的逻辑放到状态管理层里，项目中既然引入了redux这一层，就应该尽可能的把状态管理相关的逻辑都放到这一层管理。

• 提问者 suyx #1

  谢谢老师的回复。
  
  我之所以在LikeList组件里设置了一个likeListCount，就是因为在handleScroll()里面，不论我如何拉动LikeList来刷新，每次获取this.props.pageCount的值都是1，这样就无法统计到底刷新了几次。
  
  而按照您的代码写在：
  componentDidUpdate() {
      if (this.props.pageCount >= 3 && !this.removeListener) {
        document.removeEventListener("scroll", this.handleScroll);
        this.removeListener = true;
      }
  我去打印了this.props.pageCount，它的数值一般都会达到5甚至更高的时候（比如9），整个LikeList的数据刷新才会停下来。而这个时候，LikeList刷出来的数据已经高于3次了（一般5到9次）。
  
  我就是这里搞不明白。按道理，整个逻辑是通的，但每次都会刷高于3次的LikeList数据出来。

• 艾特老干部 回复 提问者 suyx #2

  我查了下，加载次数大于3次的原因，应该是滚动速度过快的导致。我改了下代码，你可以更新下来，应该可以解决这个问题

• 提问者 suyx 回复 艾特老干部 #3

  老师，您好。我刚刚直接把您的新代码拷贝到我的项目里试了下，发现加载次数还是大于3次。我在handleScroll里打印了isFetching，发现它是undefined。
  
  我不能理解这是为啥：
  ①在handleScroll里打印isFetching，不论如何拉动页面，它一直是undefined
  ②在handleScroll里打印this.props.pageCount，不论如何拉动页面，它一直是1

点开查看后面2条评论

Answer 2

艾特老干部 2020-12-21 15:42:38

chrome 开发者工具 切换 手机视图的按钮 见下图 红色框内按钮：

• 提问者 suyx #1

  好的:)