InstantSearch / React / V6 / API reference

ToggleRefinement | React InstantSearch V6 (Deprecated)

Deprecated content
This documentation is for a deprecated version of React InstantSearch. Some features and settings may be missing or their usage may have changed. Refer to the documentation for the latest version of React InstantSearch for up-to-date information.

Signature

Signature 
<ToggleRefinement
  attribute={string}
  label={string}
  value={string|number|boolean}
  // Optional parameters
  defaultRefinement={boolean}
/>

About this widget

The ToggleRefinement widget provides an on/off filtering feature based on an attribute value.

Requirements

Ensure that the attribute provided is already declared as an attribute for faceting.

Examples

Copy 
1
2
3
4
5
6
7

import { ToggleRefinement } from 'react-instantsearch-dom';

<ToggleRefinement
  attribute="free_shipping"
  label="Free Shipping"
  value={true}
/>

Props

attribute

Required
Type: string

The name of the attribute on which to apply the refinement.

Copy 
1
2
3
4

<ToggleRefinement
  // ...
  attribute="free_shipping"
/>

label

Required
Type: string

The label to display for the checkbox.

Copy 
1
2
3
4

<ToggleRefinement
  // ...
  label="Free Shipping"
/>

value

Required
Type: string|number|boolean

The value to apply on the attribute when the widget is checked.

Copy 
1
2
3
4

<ToggleRefinement
  // ...
  value={true}
/>

defaultRefinement

Optional
Type: boolean

Whether the widget should be checked by default.

Copy 
1
2
3
4

<ToggleRefinement
  // ...
  defaultRefinement={true}
/>
Did you find this page helpful?