# #reactjs #firebase #google-cloud-firestore #algolia #react-instantsearch
Вопрос:
Я пытаюсь использовать Algolia для поиска документов в моей коллекции firestore, продавцы. Я использовал облачные функции для добавления новых пользователей в Algolia index и Firestore, что хорошо работает. Использовал поле поиска InstantSearch, Хиты, из react-instantsearch-dom, но когда я запускаю свой код, отображается только поле поиска, и когда я пытаюсь выполнить поиск имени в своей коллекции, оно ничего не возвращает. Я попытался проверить элемент и проверить поисковые журналы, но ничего не вышло. Я не получал ошибок при развертывании. Я был бы очень признателен за любую помощь.
Вот index.ts для функции облака
import * as functions from "firebase-functions"; import algoliasearch from "algoliasearch"; const env = functions.config(); const vendor = algoliasearch(env.algolia.app_id, env.algolia.admin_key); const index = vendor.initIndex("vendors"); export const vendorCreated = functions.firestore.document("vendors/{vendorId}") .onCreate( ((snapshot, context) =gt; { return index.saveObject({ objectID: snapshot.id, ...snapshot.data(), }); }) ); export const vendorDeleted = functions.firestore.document("vendors/{vendorId}") .onDelete( (snapshot, context) =gt; { return index.deleteObject(snapshot.id); } ); Для компонента Страница поиска
import React from 'react' import algoliasearch from 'algoliasearch' import Image from '../assets/image/signin.jpg' import {InstantSearch, SearchBox, Hits} from 'react-instantsearch-dom' const SearchPage = () =gt; { const searchClient = algoliasearch(process.env.REACT_APP_ALGOLIA_APP_ID!, process.env.REACT_APP_ALGOLIA_SEARCH_KEY!) const Hit = ({hit}: any) =gt; { return( lt;div className='container'gt; lt;div className='profile'gt; lt;div className='img-container'gt; lt;img src={Image} /gt; lt;/divgt; lt;div className='sub-wrapper'gt; lt;h1gt;{hit.brandname}lt;/h1gt; lt;pgt;{hit.location}lt;/pgt; lt;pgt;{hit.services}lt;/pgt; lt;div className='contacts'gt; lt;pgt;{hit.phonenumber}lt;/pgt; lt;pgt;{hit.email}lt;/pgt; lt;/divgt; lt;/divgt; lt;/divgt; lt;/divgt; ) } return( lt;divgt; lt;InstantSearch searchClient={searchClient} indexName="vendors"gt; lt;header className="App-header"gt; lt;SearchBox translations={{placeholder: 'Search brandname'}}/gt; lt;/headergt; lt;Hits hitComponent={Hit}/gt; lt;/InstantSearchgt; lt;/divgt; ) } export default SearchPage;