useConnector()

Signature

const connectorApi = useConnector(
  connector: Connector,
  props: object,
  additionalWidgetProperties: object
)

Import

Copy

1
import { useConnector } from 'react-instantsearch-hooks-web';

See code examples

About this Hook

A React Hook that lets you use an InstantSearch connector in a React component.

You can use this if you want to connect your own connectors to React InstantSearch Hooks.

Examples

Copy

1
2
3
4
5
6
7
8
9
10
11
12
13
14
import { useConnector } from 'react-instantsearch-hooks-web';
import connectGeoSearch from 'instantsearch.js/es/connectors/geo-search/connectGeoSearch';

export function useGeoSearch(props, additionalWidgetProperties) {
  return useConnector(connectGeoSearch, props, additionalWidgetProperties);
}

export function GeoSearch(props) {
  const { items, refine } = useGeoSearch(props, {
    $$widgetType: 'my-organization.geoSearch'
  });

  return <>{/* Your JSX */}</>;
}

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
import {
  useConnector,
  AdditionalWidgetProperties,
} from 'react-instantsearch-hooks-web';
import connectGeoSearch, {
  GeoSearchConnectorParams,
  GeoSearchWidgetDescription,
} from 'instantsearch.js/es/connectors/geo-search/connectGeoSearch';

export type UseGeoSearchProps = GeoSearchConnectorParams;

export function useGeoSearch(
  props: UseGeoSearchProps,
  additionalWidgetProperties: AdditionalWidgetProperties
) {
  return useConnector<GeoSearchConnectorParams, GeoSearchWidgetDescription>(
    connectGeoSearch,
    props,
    additionalWidgetProperties
  );
}

export function GeoSearch(props: UseGeoSearchProps) {
  const { items, refine } = useGeoSearch(props, {
    $$widgetType: 'my-organization.geoSearch',
  });

  return <>{/* Your JSX */}</>;
}

Parameters

`connector`	type: Connector Required The InstantSearch connector to use.
`props`	type: object The props to pass to the InstantSearch widget.
`additionalWidgetProperties`	type: object Adds other properties like `$$widgetType` to the instantiated widget.

Returns


            ...connectorApi

type: object

The connector API, such as state and functions.

Did you find this page helpful?

useConnector()

About this Hook

Examples

Parameters

Returns

On this page