Невозможно отобразить данные при определении индекса массива при использовании Contentful CMS

Невозможно получить данные при использовании индекса массива с контентом CMS

constructor() {
    super();
    this.state = {
        partners: [],
    }
}

client = contentful.createClient({
    space: process.env.REACT_APP_CONTENTFUL_SPACE_ID,
    accessToken: process.env.REACT_APP_CONTENTFUL_ACCESS_TOKEN
})

componentDidMount() {
    this.client.getEntries({
        'content_type': 'partnersCollection',
        'order': 'sys.createdAt',
    })
        .then(response => {
            this.setState({
                partners: response.items
            })
        })
        .catch(console.error);
}

render(){
    console.info("SIDE BAR RESULT: ", this.state.partners)
    console.info(this.state.partners[0])
    return null;
}

Console.log("SIDE BAR RESULT: ", this.state.partners) отобразит все результаты содержательной cms. При использовании с примером индекса массива this.state.partners[0].fields появится ошибка

Cannot read property 'fields' of undefined

Кто-нибудь знает, почему с индексом массива это вызовет сообщение об ошибке?

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
0
23
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

В исходном состоянии - this.state.partners пустой массив, поэтому поиск this.state.partners[0].fields выдаст ошибку

вам нужно поставить галочку в рендере

    if (this.state.partners.length > 0) {
         this.state.partners[0].fields
    }

Как только обещание будет разрешено, оно установит state.partners в componentDidMount(), render() обновится.

Другие вопросы по теме