Reactjs: вызов нескольких действий с разбиением на страницы замедляет страницу

Question

У меня проблема с кликом на пейджер для повторного рендеринга списка пользователей. Пожалуйста, проверьте мой лог c ниже

Во-первых, я перечисляю всех пользователей, вызывая действие ListUsersAction, например:

const ListUsers = props => {
  useEffect(() => {
      var resPerPage = configList.users.resPerPage;
      props.ListUsersAction(resPerPage, 1);
  },[]);
  .....
  .....
}

Я использовал редуктор listUsersReducer для хранения пользователей. Я называю это так:

if (props.listUsersReducer.thanhvien.length > 0) {
    const users = props.listUsersReducer.thanhvien;

    //Then render all user here.
    users.map((user)=>....);

    //I make a pagination to change users list by click on each page.
    <Pagination datasend={datasend} />
}

У меня нет проблем с первой загрузкой. И проблема возникает, когда я нажимаю 6-7 раз на нумерацию страниц для вызова LoadUsersAction. Он начинается медленно и вызывает задержку страницы.

Действие вызывается при каждом изменении страницы.

Я не знаю ничего, что я сделал неправильно. Можете ли вы помочь мне проверить это. Большое вам спасибо.

Answer 1

Проблема решена. Это не связано с редуксом. Это магазин. Подписка визуализируется несколько раз. Просто добавьте его в useEffect, и оно решено.