getAlgoliaResults
The getAlgoliaResults
function lets you query several Algolia indices at once.
If you’re using autocomplete-js
, all Algolia utilities are available directly in the package with the right user agents and the virtual DOM layer. You don’t need to import the preset separately.
Installation
First, you need to install the preset.
1
2
3
yarn add @algolia/autocomplete-preset-algolia
# or
npm install @algolia/autocomplete-preset-algolia
Then import it in your project:
1
import { getAlgoliaResults } from '@algolia/autocomplete-preset-algolia';
If you don’t use a package manager, you can use the HTML script
element:
1
2
3
4
<script src="https://cdn.jsdelivr.net/npm/@algolia/autocomplete-preset-algolia"></script>
<script>
const { getAlgoliaResults } = window['@algolia/autocomplete-preset-algolia'];
</script>
Example
This example uses the function along with the algoliasearch
API client.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
import algoliasearch from 'algoliasearch/lite';
import { createAutocomplete } from '@algolia/autocomplete-core';
import { getAlgoliaResults } from '@algolia/autocomplete-preset-algolia';
const searchClient = algoliasearch(
'latency',
'6be0576ff61c053d5f9a3225e2a90f76'
);
const autocomplete = createAutocomplete({
// ...
getSources() {
return [
{
sourceId: 'products',
getItems({ query }) {
getAlgoliaResults({
searchClient,
queries: [
{
indexName: 'instant_search',
query,
params: {
hitsPerPage: 5,
},
},
],
});
},
// ...
},
];
},
});
Parameters
searchClient
|
type: SearchClient
Required
The initialized Algolia search client. |
queries
|
type: MultipleQueriesQuery[]
Required
The queries to perform. |
queries ➔ queries
indexName
|
type: string
Required
The index name to search into. |
||
query
|
type: string
The query to search for. |
||
params
|
type: SearchParameters
Algolia search parameters. These are the default search parameters. You can leave them as is and specify other parameters, or override them.
Copy
|
||
transformResponse
|
type: (response: { results: Array<SearchResponse<THit> | SearchForFacetValuesResponse>, hits: MaybeArray<Hit<THit>[]>, facetHits: MaybeArray<FacetHit[]> }) => MaybeArray<Hit<THit>[] | FacetHit[]>
The function to transform the Algolia response before passing it to the Autocomplete state. You have access to the full Algolia results, as well as the pre-computed hits and facet hits. This is useful to manipulate the hits, or store data from the results in the context. This is the default implementation:
Copy
|
Returns
The function returns a description with the following interface:
1
2
3
4
5
6
{
searchClient: SearchClient;
queries: MultipleQueriesQuery[];
transformResponse: TransformResponse<THit>;
execute: Execute<THit>;
}