QueryError
QueryError
In this article
Example Implementation
query-error.fn.tsx
import {QueryError as HeadlessQueryError} from '@coveo/headless';
import {useEffect, useState, FunctionComponent} from 'react';
interface QueryErrorProps {
controller: HeadlessQueryError;
}
export const QueryError: FunctionComponent<QueryErrorProps> = (props) => {
const {controller} = props;
const [state, setState] = useState(controller.state);
useEffect(() => controller.subscribe(() => setState(controller.state)), []);
if (!state.hasError) {
return null;
}
return (
<div>
<div>Oops {state.error!.message}</div>
<code>{JSON.stringify(state.error)}</code>
</div>
);
};
// usage
/**
* ```ts
* const controller = buildQueryError(engine);
*
* <QueryError controller={controller} />;
* ```
*/
The QueryError
controller allows to retrieve information about the current error returned by the search API, if any.
Methods
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 QueryError
controller.
Properties
-
error:
ErrorPayload | null
The current error for the last executed query, or
null
if none is present. -
hasError:
boolean
true
if there’s an error for the last executed query andfalse
otherwise.
Initialize
buildQueryError
Creates a QueryError
controller instance.
Parameters
-
engine:
SearchEngine
The headless engine.
Returns QueryError
Related Types
Unsubscribe
Call signatures
-
(): void