usePreviewSearch(プレビューサーチ)
日本語翻訳に関する免責事項
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
preview searchクエリ フックを使用して、preview searchウィジェットのデータを要求および取得します。
Requestパラメーター
|
名前 |
種類 |
形容 |
|---|---|---|
|
keyphrase |
糸 |
検索する文字列 |
|
suggestionsList |
文字列の配列 |
提案のリスト |
|
itemsPerPage |
整数 |
ページ上のアイテムの数。 |
一般的な応答
RequestResponse
{
widgetRef,
actions: { onItemClick, onKeyphraseChange },
queryResult: {
isFetching,
isLoading,
data: {
content: articles = [],
suggestion: {
content_name_context_aware: articleSuggestions = [],
content_trending_category: trendingCategorySuggestions = [],
} = {},
} = {},
},
}輸入
RequestResponse
import { usePreviewSearch } from '@sitecore-search/react';例
RequestResponse
import type {
PreviewSearchInitialState,
PreviewSearchWidgetQuery,
SearchResponseSuggestion,
} from '@sitecore-search/react';
import { WidgetDataType, usePreviewSearch, widget } from '@sitecore-search/react';
type ArticleModel = {
id: string;
name: string;
image_url: string;
url: string;
source_id?: string;
};
articles: Array<ArticleModel>;
type InitialState = PreviewSearchInitialState<'itemsPerPage' | 'suggestionsList'>;
export const PreviewSearchComponent = ({ defaultItemsPerPage = 6 }) => {
const {
widgetRef,
actions: { onItemClick, onKeyphraseChange },
queryResult: {
isFetching,
isLoading,
data: {
content: articles = [],
suggestion: {
content_name_context_aware: articleSuggestions = [],
content_trending_category: trendingCategorySuggestions = [],
} = {},
} = {},
},
} = usePreviewSearch<ArticleModel, InitialState>({
query: (query:PreviewSearchWidgetQuery) => query,
state: {
suggestionsList: [
{ suggestion: 'content_name_context_aware', max: 10 },
{ suggestion: 'content_trending_category', max: 10 },
],
itemsPerPage: defaultItemsPerPage,
},
});
const loading = isLoading || isFetching;
return ( <div ref={widgetRef}> ... </div> );
};
const PreviewSearchLeftStyledWidget = widget(PreviewSearchComponent, WidgetDataType.PREVIEW_SEARCH, 'content');
export default PreviewSearchLeftStyledWidget;メモ
UIコンポーネントをウィジェット コンポーネントに変換してから、ページに追加します。
コンポーネントをウィジェットコンポーネントに変換するには、UIコンポーネントをwidget関数またはsetWidget関数に渡します。