QueryTrigger
QueryTrigger
This is for:
DeveloperExample Implementation
query-trigger.fn.tsx
import {QueryTrigger as HeadlessQueryTrigger} from '@coveo/headless';
import {useEffect, useState, FunctionComponent} from 'react';
interface HeadlessQueryTriggerProps {
controller: HeadlessQueryTrigger;
}
export const QueryTrigger: FunctionComponent<HeadlessQueryTriggerProps> = (
props
) => {
const {controller} = props;
const [state, setState] = useState(controller.state);
useEffect(() => controller.subscribe(() => updateState()), []);
const updateState = () => {
setState(props.controller.state);
};
if (state.wasQueryModified) {
return (
<div>
The query changed from {state.originalQuery} to {state.newQuery}
</div>
);
}
return null;
};
// usage
/**
* ```tsx
* const controller = buildQueryTrigger(engine);
*
* <QueryTriggerFn controller={controller} />;
* ```
*/
The QueryTrigger
controller handles query triggers.
Methods
undo
Undoes a query trigger’s correction.
subscribe
Adds a callback that’s invoked on state change.
Parameters
-
listener:
() => void
A callback that’s invoked on state change.
Returns Unsubscribe
: A function to remove the listener.
Attributes
state
The state of the QueryTrigger
controller.
Properties
-
newQuery:
string
The new query to perform a search with after receiving a query trigger.
-
originalQuery:
string
The query used to perform the search that received a query trigger in its response.
-
wasQueryModified:
boolean
A boolean to specify if the controller was triggered resulting in a modification to the query.
Initialize
buildQueryTrigger
Creates a QueryTrigger
controller instance.
Parameters
-
engine:
SearchEngine
The headless engine.
Returns QueryTrigger
Related Types
Unsubscribe
Call signatures
-
(): void