Infinite Scroll Hooks Issue

radu · 18 August 2021 08:01

Hello.

I am currently building an archive page that initially loads 9 posts and then on a press of a button (“Load more”) it will load 9 more posts and so on.

I am using the “usePostTypeInfiniteScroll” for doing it, but I encounter the following issues:

The first 9 posts are loaded correctly and they work as expected, but every time I press Load More, it only loads 1 post, not 9 (yes, I have more than 10 posts).
The Archive page also shows up in the Posts list (how can I remove it?)
Sometimes when I load a few posts and I scroll up or down, the page goes to one of the Posts Pages. How can this be fixed?

Gist containing my component code: Infinite Load Hooks - UsePostTypeInfiniteScroll · GitHub

Thank you!

kasper · 18 August 2021 08:08

Hi @radu

Can you try and change the limit to 10, and test if that works?

radu · 18 August 2021 08:33

Hi @kasper,

Thanks you for trying to help. The same behaviour happens when the limit is set to 10.

kasper · 18 August 2021 09:44

Hi @radu,

I have infinite scroll on this page:

https://arctic-bioscience.com/news/

Here is the gist:

gist.github.com

https://gist.github.com/kasperaamodt/c01d8b85f4566d5ae1ddf0d5a76ffaeb

list.js

import { useArchiveInfiniteScroll } from "@frontity/hooks";
import { connect, styled } from "frontity";
import React from "react";
import Loading from "../pages/loading";
import ListPage from "./list-page";

const List = () => {
  const {
    pages,
    isLimit,

This file has been truncated. show original

After looking at the code, I also now remember that limit is page numbers, not posts. So 2 or 3 should be a good start.

radu · 18 August 2021 10:13

@kasper The limit you have been implemented is using “useArchiveInfiniteScroll”, not “usePostTypeInfiniteScroll”.

I was trying to use the “usePostTypeInfiniteScroll”, in order to also have the functionality of choosing the archive source.

maniego.gio11 · 23 September 2021 15:26

Hello may i add another question? is it possible to do infinite scroll without changing the url of the site? cause i have a custom home page that loads different categories.