react bee-search-panel component for tinper-bee

折叠查询条件

使用方法

import SearchPanel from 'bee-search-panel';

class SearchPanelDemo extends Component {
    render() {
        return (
            <SearchPanel/>
        )
    }
}

样式引入

• 可以使用link引入build目录下SearchPanel.css

<link rel="stylesheet" href="./node_modules/bee-search-panel/build/SearchPanel.css">

• 可以在js中import样式

import "./node_modules/bee-search-panel/src/SearchPanel.scss"
//或是
import "./node_modules/bee-search-panel/build/SearchPanel.css"

API

|参数|说明|类型|默认值| |:---|:-----|:----|:------| |isExpandedBtn|是否显示展开按钮|boolean|true| |defaultExpanded|展开和收起的默认状态|boolean|false| |expanded|是否默认展开|boolean|false| |onSearch|点击查询的回调|function|-| |onReset|点击查询的回调|function|-| |title|查询面板标题|string|'默认筛选'| |onPanelChangeStart|显示或隐藏开始回调|function|-| |onPanelChangeIng|显示或隐藏进行中回调|function|-| |onPanelChangeEnd|显示或隐藏结束回调|function|-| |onChange|点击显示或隐藏回调|function|-| |showOperation|是否显示 查询，清空操作按钮|bool|-|

开发调试

$ npm install -g bee-tools
$ git clone https://github.com/tinper-bee/bee-search-panel
$ cd bee-search-panel
$ npm install
$ npm run dev