0

По аналогии с этим вариантом https://codesandbox.io/s/bold-field-3eqql?file=/src/App.js попытался вывести свою пагинацию на основе react-paginate: https://codesandbox.io/s/eager-oskar-471xm?file=/src/App.js Но репозитории и номера страниц не отображаются. Что неверно? P.S. Очень желательно вынести пагинацию в отдельный компонент.

1 ответ 1

0

У вас данные user появляются только при поиске. Если ввести корректные данные в поиск и нажать Enter всё будет работать. Возможно вы хотите искать без onSubmit? Тогда необходимо делать изменения на onChange инпута и убрать форму.

  const [user, setUser] = useState(null); // здесь user по умолчанию null

  async function getUser(login) {
    let result0;
    result0 = (await axios.get(`https://api.github.com/users/${login}`)).data;
    setUser(result0);
  }

  useEffect(() => {
    if (user) { // user === null поэтому дальше он не идёт. 
      fetch(
        `//api.github.com/users/${user.login}/repos?page=${currentPage}&per_page=${PER_PAGE}`
      )
        .then((res) => res.json())
        .then(setData);
    }
  }, [user, currentPage]);

пример Обязательно после ввода нажать Enter. Такова логика вашего компонента сейчас

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.