Widgets SortBy

Description

The SortBy component displays a list of indexes allowing a user to change the hits are sorting.

Requirements

Algolia handles sorting by creating replica indices. Read more about sorting on the Algolia website.

Props

items*
type: {value: string, label: string}[] 

The list of indexes to search in.

defaultRefinement*
type: string 

The default selected index.

transformItems
type: function 

Function to modify the items being displayed, e.g. for filtering or sorting them. Takes an items as parameter and expects it back in return.

Example usage

import React from 'react'; import { InstantSearch, SortBy } from 'react-instantsearch-dom'; const App = () => ( <InstantSearch appId="latency" apiKey="6be0576ff61c053d5f9a3225e2a90f76" indexName="instant_search" > <SortBy defaultRefinement="instant_search" items={[ { value: 'instant_search', label: 'Featured' }, { value: 'instant_search_price_asc', label: 'Price asc.' }, { value: 'instant_search_price_desc', label: 'Price desc.' }, ]} /> </InstantSearch> );

CSS classes

.ais-SortBy {}

the root div of the widget

.ais-SortBy-select {}

the select

.ais-SortBy-option {}

the select option

Translation keys

This widget has no translations.