# CFilter 筛选组件 ## 功能说明 该组件用于实现页面筛选功能,包含顶部筛选条和展开的更多筛选抽屉,支持多种筛选控件类型,包括选择器、日期范围、单选和输入框等。 ## 引用方式 ```js import { CFilter } from '@components/plugins/filter'; ``` ## 组件参数 - `filterData` (Object,默认值:{}):筛选数据对象 - `bar` (Object,默认值:{}):筛选横条项目配置 - `type` (String):控件类型,可选值有 'select'、'dateRange'、'input' - `label` (String):显示的标签 - `name` (String):字段名称 - `cancelable` (Boolean):是否可取消选择,仅对select类型有效 - `items` (Array,默认值:[]):筛选展开层项目列表配置 - 每项格式同bar,但type可选值多一个'radio' - `selectOptions` (Object,默认值:{}):各个项目的选项列表 - 格式为 `{ 字段名: [{label: '显示文本', value: '值'}] }` - `onChange` (Function,必填):筛选变化时的回调函数 - 参数:`filterData` (Object) 变更后的筛选数据对象 ## 实例方法 组件没有对外暴露的实例方法 ## 使用示例 ### 基础用法 ```html ``` ## 注意事项 - 筛选条(bar)只能配置一个筛选项 - 抽屉式筛选(items)可以配置多个筛选项 - 每个筛选项的类型(type)必须与组件类型匹配 - select和radio类型的选项必须在selectOptions中配置对应的选项数据