Как получить доступ к свойству объекта, возвращенного из Firestore? - PullRequest
Новая
       21

Как получить доступ к свойству объекта, возвращенного из Firestore?

0 голосов
/ 04 апреля 2020

Я новичок в React, у меня небольшая проблема, с которой я не могу разобраться.

Я успешно извлекаю данные из Firestore и обновляю состояние items. Когда я зарегистрировал item[1], он вернул объект с ожидаемыми свойствами id, name, description, но при попытке item[1].id он дал мне Невозможно прочитать свойство 'id' из неопределенного error

Не могли бы вы дать мне подсказку о том, что здесь может быть не так?

Вот так выглядит мой код 

import React, { useState, useEffect, useCallback } from 'react';
import db from '../../../firestore';

const Carousel = () => {

    const [items, setItems] = useState([]);

    useEffect(() => {
        db.collection('destinations')
            .get()
            .then(querySnapshot => {
                const data = [];
                querySnapshot.docs.map(doc => {
                    data.push(doc.data())
                })
                setItems(data);
            }).catch(err => console.log(err));
    }, [])

    return (
        <div>
            {console.log(items[1])} {/* This works  */}
            {console.log(items[1].id)} {/* This gave error */}
        </div>
    )
};

export default Carousel;

1 Ответ

0 голосов
/ 04 апреля 2020

Поскольку массив emtpy является истинным значением, вы должны сделать это в своем возвращении 

return (
    <div>
        {items[1] &&
            <div>{items[1].id}</div> 
        }
    </div>
)

Вам нужно проверить items[1], когда он рендерится, вы можете получить доступ только тогда, когда items имеет данные. Когда он пуст, доступ к id выдаст вам сообщение об ошибке.

...