React EasyUI 搜索框

2020-06-24 12:00 更新

搜索框( SearchBox )用于提示用戶輸入搜索值。它可以結(jié)合一個菜單,允許用戶選擇不同的搜索類別。當用戶按下 ENTER 鍵或者點擊組件右側(cè)的搜索按鈕時,搜索動作將被執(zhí)行。

屬性列表

名稱 數(shù)據(jù)類型 作用描述 默認值
value string 搜索字段值。 null
category string 從菜單項檢索類別值。 null
categories array 搜索類別條項。 [ ]
menuAlign string 菜單對齊??蛇x值:'left', 'right'。 left
buttonAlign string 搜索按鈕對齊,可選值:'left', 'right'。 right
buttonlconcls string 搜索按鈕圖標樣式類。 icon-search

事件列表

名稱 參數(shù) 作用描述
onSearch {value, category} 搜索時觸發(fā)。

注:
- 繼承: InputBase 。

使用方法

<SearchBox
  style={{ width: 300 }}
  placeholder="Input something here"
  value={value}
  onSearch={this.handleSearch.bind(this)}
  addonRight={() => (
    <span className="textbox-icon icon-clear" title="Clear value" onClick={this.handleClear.bind(this)}></span>
  )}
/>

  • 參考圖例:

searchbox

以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號