Задать вопрос
@MRcracker
nextjs

Почему свойства props компонента is not defined?

Написал код и поместил его в index.js. Все работает. Решил вынести код в отдельный компонент и код стал выдавать ошибку, что list is not defined. Как решить проблему и с чем она связана?

export default function Home({list}) {
  return (
    <>
      <Head>
        <title>Home</title>
        <meta name="description" content="Generated by create next app" />
        <link rel="icon" href="/favicon.ico" />
      </Head>

      <h1>Welcome home!</h1>
      <ul>
        {list.map((item) => (
          item.links.map((elem)=>(
            <li >
            <Link href={`/menu/${elem.id}`}>
              <a>{elem.label}</a>
            </Link>
          </li>
          ))
   
        ))}
      </ul>

    </>
  );
}
export const getStaticProps = async () => {


  const menuData = await axios.get(`${url}/menu`)

  return {
    props: {
      list: menuData.data,
    },
    revalidate: 1, 
  };
};
  • Вопрос задан
  • 211 просмотров
5 комментариев
Подписаться 1 Простой 5 комментариев
Решения вопроса 1
IwanQ
@IwanQ
Плохие времена часто дают прекрасные возможности
Ошибка list is not defined связана с тем, что функция для фетчинга данных getStaticProps не работает за пределами папки /pages.

Вы можете фетчить только на страницах находящихся в /pages
Если вы вынесли компонент в отдельную папку, например /components/pages/MainPage и там пытаетесь использовать getStaticProps - эффекта не будет.

Из доков:
getStaticProps can only be exported from a page. You can’t export it from non-page files.


Решение:
Перенести функцию getStaticProps на страницу в папке /pages, а уже далее передавать пропсы в нужный компонент
Ответ написан
1 комментарий
1 комментарий
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
React Native developer (+Node.js)
CTRL+ • Москва
от 250 000 до 320 000 ₽
Embedded Software Engineer
CTRL+ • Москва
от 200 000 до 300 000 ₽
Senior backend developer (Node.js)
CTRL+ • Белград
от 250 000 до 320 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Разместить шаблон сайта с личным кабинетом под хостинг серверов
29 нояб. 2024, в 01:43
7000 руб./за проект
Плагин для Chrome для автоматизации действий в МойСклад
29 нояб. 2024, в 00:30
2000 руб./за проект
Разработка фронта на VUE.JS
28 нояб. 2024, в 23:03
1500 руб./в час
Ещё заказы