# SearchBar

* category: UI
* chinese: UI 组件
* type: UI 组件

---

## 设计思路

SearchBar 是 Input + Button 的组合，常用于做屏幕顶部的搜索框。

## API

| 参数             | 说明                                        | 类型        | 默认值    |
| ---------------- | ------------------------------------------- | ----------- | --------- |
| showSearchButton | 是否展示搜索按钮                            | boolean     | true      |
| defaultValue     | 默认值                                      | String      | 无        |
| value            | 默认值 【即将废弃，使用 defaultValue 代替】 | String      | 无        |
| placeholder      | placeholder                                 | String      | 无        |
| onChange         | 用户输入时触发                              | Function    |
| onSearch         | 用户点击搜索按钮时触发                      | Function    | false     |
| style            | 样式                                        | styleObject | 无        |
| placeholderColor | placeholder 的颜色，注意 h 小写             | string      | '#cccccc' |
| inputStyle       | 搜索区域样式                                | styleObject | {}        |
| centered         | placeholder 是否居中，新属性，不稳定，慎用  | boolean     | false     |
| onInput          | 输入框输入事件                              | Function    | 无        |
| onFocus          | 输入框获得焦点事件                          | Function    | 无        |
| onBlur           | 输入框失去焦点事件                          | Function    | 无        |

## 其他
- bug、建议联系 <a href="dingtalk://dingtalkclient/action/sendmsg?dingtalk_id=kjwo3w5">@翊晨</a>
- 钉钉交流群

<img src="https://img.alicdn.com/tfs/TB101EESpXXXXXFXpXXXXXXXXXX-1122-1362.jpg" width="260" />