Компоненты ReactiveSearch и состояние прохождения / реквизиты
У меня есть компонент ReactiveList, который живет в моем SearchContainer. Все, что он делает, это отображает результаты поиска на основе запроса пользователя. Компонент ReactiveList работает, он автоматически отображает содержимое моего индекса ES (размещенного на Appbaseio). Он не отображает результаты, основанные на пользовательском запросе.
В моем глобальном Navbar у меня есть компонент DataSearch (условно отображается на основе маршрута), который обеспечивает автозаполнение. У меня также есть почти идентичный компонент DataSearch на моей домашней странице ('/').
Я пытаюсь выяснить, как передать запрос из DataSearch в ReactiveList, чтобы отображаемые результаты действительно основывались на запросе, отправленном пользователем?
Итак, позвольте мне повторить, я пытаюсь выяснить, как заставить DataSearch и ReactiveList общаться друг с другом.
В моем компоненте DataSearch у меня есть
<DataSearch
componentId="q"
URLParams={true}
onValueSelected={(value, cause, source) => {
if (cause !== 'SUGGESTION_SELECT') {
<Redirect to={{
pathname: '/search',
search: `?q=${value}`
}}/>;
} else {
this.valueSelected = true;
}
}}
...
/>
В моем компоненте ReactiveList у меня есть:
<ReactiveList
componentId="q"
URLParams={true}
onNoResults="Sorry, no results were found, try searching again."
react={{ or: ["q"] }}
onData={(res) => { ... }}
...
/>
Из того, что я понимаю, пока у меня есть URLParams={true} в DataSearch и componentId='q' в DataSearch и ReactiveList - поиск должен работать. Автозаполнение кажется работоспособным, но ReactiveList НЕ отображает результаты, основанные на запросе пользователя.
Нужно ли добавить другое свойство в DataSearch или...? Куда я иду не так.
1 ответ
Различные компоненты не должны иметь одинаковый идентификатор. Установите componentId для вашего ReactiveList на что-то уникальное (и выберите другой уникальный идентификатор для вашего DataSearch). Не уверен, что в настройке есть другая проблема, но это можно исправить сразу.