API Reference / React InstantSearch Widgets / Control

Control

Widget signature 
<Control
  // Optional parameters
  translations={object}
/>
See code examples
See Live example

About this widget

The Control widget allows the user to control the different strategies for the refinement (enable/disable refine on map move).

Examples

Copy 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

import {
  GoogleMapsLoader,
  GeoSearch,
  Control,
  Marker,
} from 'react-instantsearch-dom-maps';

<div style={{ height: 500 }}>
  <GoogleMapsLoader apiKey="GOOGLE_MAPS_API_KEY">
    {google => (
      <GeoSearch google={google}>
        {({ hits }) => (
          <div>
            <Control />
            {hits.map(hit => (
              <Marker key={hit.objectID} hit={hit} />
            ))}
          </div>
        )}
      </GeoSearch>
    )}
  </GoogleMapsLoader>
</div>

Props

translations
type: object
Optional

A mapping of keys to translation values.

  • control: the label of the radio button.
  • redo: the label of the redo button.
Copy 
1
2
3
4
5
6

<Control
  translations={{
    control: 'Search as I move the map',
    redo: 'Redo search here',
  }}
/>

Did you find this page helpful?

React InstantSearch v6