Получение данных из Firestore в ReactJavascript

Форум по Javascript
Ответить
Гость
 Получение данных из Firestore в React

Сообщение Гость »


Я создаю приложение чата в React, используя Firebase. В основном я фокусируюсь на групповых чатах. Я не могу получить сообщения из Firestore. Я могу публиковать сообщения в БД, но не получать их. Вот код компонента Chat.js.

onst Chat = ({ groupId }) => { const [сообщения, setMessages] = useState([]); константная прокрутка = useRef(); const [selectedGroupId, setSelectedGroupId] = useState (null); constchatGroupsData = [ { id: 'Group1', name: 'Group1' }, { id: 'Group2', name: 'Group2' }, ]; const handleGroupSelection = (selectedGroupId) => { setSelectedGroupId (selectedGroupId); }; useEffect(() => { если (идентификатор группы) { console.log("Получение сообщений для groupId:", groupId); const messagesCollectionRef = коллекция (дб, 'ChatGroups', groupId, 'Сообщения'); const q = query(messagesCollectionRef, orderBy('timestamp')); const отписаться = onSnapshot(q, (querySnapshot) => { пусть сообщения = []; querySnapshot.forEach((doc) => { messages.push({ ...doc.data(), id: doc.id, groupId }); }); setMessages (сообщения); }, (ошибка) => { console.error('Ошибка получения сообщений:', error); }); return () => отписаться(); } }, [идентификатор группы]); console.log("Сообщения:", messages); возвращаться ( {/* Список чатов (слева) */} {/* Содержимое списка чата */} {/* Интерфейс чата (правая сторона) */} Психическое здоровье {/* Измените заголовок */} {/* Сообщения чата */} {примеры сообщений && примеры сообщений .filter((message) => message.groupId === selectedGroupId) // Фильтрация сообщений по идентификатору группы .map((сообщение) => ( ))} {/* Компонент отправки сообщения */} {/* Индикатор прокрутки */} ); }; Все необходимые импорты сделаны. Я проверил, все остальные компоненты работают нормально.

Я попробовал жестко запрограммировать примеры сообщений в самом компоненте, и они успешно отрисовываются. Также console.log("Messages:", messages); возвращает пустой массив.
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»