react elasticsearch

React Elasticsearch

React + Elasticsearch的UI組件。使用聲明性組件創建搜索應用程序。

用法

文檔和可播放的演示。

 const MySearchComponent = ( ) => (
  < Elasticsearch url = "http://example.org/search" >
    < SearchBox id = "mainSearch" fields = { [ "title" ] } />
    < Facet id = "actors" fields = { [ "actors" ] } />
    < Facet id = "releasedYear" fields = { [ "releasedYear" ] } />
    < Results
      id = "results"
      items = { data =>
        // Map on result hits and display whatever you want.
        data . map ( item => < MyCardItem key = { item . _id } source = { item . _source } /> )
      }
    />
  </ Elasticsearch >
) ; 

安裝

 npm i react-elasticsearch
yarn add react-elasticsearch

發展

您可以通過Storybook測試組件（20多個示例）。

 npm run storybook

主要功能

• ？根據MIT許可發布。
• ？ ‍？每個組件都是由React構建的，並且是可自定義的。沒有太多的額外功能或魔術。
• ？它沒有任何樣式，因此實施自己的責任是開發人員的責任。
• ？ 35.32kb的整個LIB均與舊瀏覽器兼容：> 0.03％的使用情況。
• ？沒有遺產：創建於2019年，於2021年更新了掛鉤。

為什麼？

我們開始使用ReactiveSearch（眾所周知的搜索UI組件lib for React）建立法國文化遺產開放平台的搜索經驗。幾週後，我們意識到我們花了很多時間來調整和黑客攻擊。我們自己重寫了幾乎所有組件。我們在存儲庫上打開了問題並提取請求，但似乎LIB在重寫過程中有點陷入困境。我們發現我們需要一個簡單的lib，可以輕鬆地使用類似的API擴展，我們創建了這個lib。該自由的功能比其他功能少，甚至不是一個體面的競爭對手。但是，由於它幫助我們建立了搜索經驗，因此已發布。希望它可以幫助您！

貢獻

打開問題和PR在這裡：https：//github.com/betagouv/reaeact-elasticsearch