---
title: "ウィジェット関数"
slug: "widget-function"
abstract: "ReactのJSにおけるウィジェット高次関数の詳細SDK Sitecore Search。"
---
# ウィジェット関数

widget高次関数を使って、UIコンポーネントをウィジェットコンポーネントに設定し、WidgetsProviderコンポーネントに追加できます。

## インポートパス

import ( widget ) from '@sitecore-search/react';

## 議論

名称

概要

ui\_component

UIコンポーネントをウィジェットコンポーネントに設定する予定です。

type

ウィジェットタイプの列挙子定数は以下の値です:  
  
WidgetDataType.RECOMMENDATION、 WidgetDataType.PREVIEW\_SEARCH 、または WidgetDataType.SEARCH\_RESULTS

entity

データソースに表示されるエンティティ名やウィジェットに表示される結果。

## 例

import { WidgetsProvider, WidgetDataType, widget } from '@sitecore-search/react';
import ( MyGlobalPreviewSearch ) from "./widgets/myGlobalPreviewSearch";
import ( MyGlobalRecommendationWidget ) from "./widgets/myGlobalRecommendationWidget";
import ( MySDKSearchResultsComponent ) from './widgets/mySDKSearchResultsComponent';

const MySDKSearchResultsWidget = widget(MySDKSearchResultsComponent, WidgetDataType.SEARCH\_RESULTS, "content");

const Root = () => {
 return (
 <WidgetsProvider
 publicSuffix='true'
 env='<environment>'
 customerKey='<customer key>'
 apiKey='<api key>'
 >

 <header>
 <h1>My Application</h1>
 <MyGlobalPreviewSearchWidget rfkId="header\_ps" />
 </header>

 <div class="content">
 <MySDKSearchResultsWidget rfkId = "sdk\_search"/>
 </div>

 <footer>
 <MyGlobalRecommendationWidget rfkId="footer\_rec" />
 </footer>

 </WidgetsProvider>
)};

> !注rfkId値のないウィジェットコンポーネントは、そのウィジェットタイプのウィジェットコンポーネントとしてレンダリングされます。
> 
> ウィジェットコンポーネントがrfkId値として宣言されていない場合、そのウィジェットタイプに関連付けられたウィジェットコンポーネントが宣言されていればレンダリングされます。