git地址:https://github.com/jiqianqin/filters

不断优化中,欢迎加入讨论~

filter-tags

效果图:

参数 说明 格式 备注
data
展示的数据

[{ "key": "areaRange","desc": "面积(㎡)",

"nodeList": [

{"key": 1,"desc": "50m²以下"},

{"key": 2,"desc": "50-70m²" }]

},{

"key": "toward","desc": "朝向",
"nodeList": [

{"key": 1,"desc": "东" },
{"key": 2,"desc": "南"}]
}]

 
sureBtn
确定按钮
sureBtn:"确定"
 
resetBtn
清空按钮
resetBtn:"清空选项"
 
selected
初始化选择项
selected:{
areaRange:[1,3,5,7],toward[1,2]}
 
clickHandle
点击具体的标签
clickHandle:function(data){}
data为此次点击的数据。格式为

{ key:"1" , type:"areaRange" }

comfirm
 点击确认后触发函数

comfirm:function(data){}
data为所有的选中的数据 {"areaRange":["1","3","5","7"],"toward":["3","4"]}
multiselectEnable
是否支持多选
multiselectEnable:false
false:不支持多选 true:支持多选

filterSigle

效果图

参数 说明 格式 备注
data
 展示数据

data:[
{"key": null,"desc": "全部"},
{"key": 1,"desc": "100万以下"},
{"key": 2,"desc": "100-150万"}]
 
settingEnable
是否支持自定义
   
settingType
自定义的样式
settingType:"interval"
 
settingTip
区间
settingTip:"区间"
 
placeholderLow
最低区间提示
placeholderLow:"最低区间"
 
placeholderHigh
最高区间提示
placeholderHigh:"最高区间"
 
sureBtn
确定按钮显示
sureBtn:"确定"
 
selected
  初始化选择的数据

若是单选,则传递字符串(对应要选中的值)

selected:"2"

若是自定义的值,则传递数组
selected:[100,200]
 
clickHandle
点击事件
 
clickHandle:function(data){}
 data为字符串,key的值
comfirm
点击确认
comfirm:function(data){}

data:{

intervalLow:"上区间的值",
intervalHigh:"下区间的值"

}

       

filterMultiple

效果图

参数 说明 格式 备注
data
展示数据 data:

[{"key": 1,"desc": "一室"},
{"key": 2,"desc": "二室",
{"key": 3,"desc": "三室"}]
 
sureBtn
确定按钮展示文字
sureBtn:"确定"
 
selected
 初始化选择的值

selected:[1,2]
 key值为1和2的会默认选中 
comfirm
点击确认按钮后执行函数
comfirm:function(data){}
data:{

selectList:

[1,2],

selectFlag:0};

// selected:已经选择的数据

//selectFlag 0:全不选 1:全选 2:部分选择

selectAllEnable
是否支持全选
selectAllEnable:true
true:支持 false:不支持
selectAllTip
全选显示字样
selectAllTip:"全部"
 
selectAllHandle
点击全选后触发函数
selectAllHandle:function(){}
 
clickHandle
点击每一项触发函数
clickHandle:function(key){}
key:1(此次点击的数)


filterGrade
效果图

clickHandle

参数 说明 格式 备注
data
展示的数据
[{
key": null,
 "desc": "全部",
 "nodeList": [{"key": null,"desc": "全部"}]
},{ "key": "310101","desc": "黄浦",
 "nodeList": [
{"key": null, "desc": "全部"},
{"key": "HP01","desc": "董家渡"},
{"key": "HP02","desc": "打浦桥"}
{"key": "HP04","desc": "黄浦滨江"}]
},
{
"key": "310104",
 "desc": "徐汇",
 "nodeList": [
{ "key": null,"desc": "全部"},
{ "key": "XH01","desc": "漕河泾"},
{ "key": "XH02","desc": "长桥"},
{ "key": "XH03","desc": "华东理工"},
{ "key": "XH04","desc": "华泾"}
]},
 
level
显示层级数目
level:

最多为3

clickHandle
点击事件
clickHandle:function(){}
 
percent
展示的百分比,整行为99
percent:[,,]
 
 

filter-api文档的更多相关文章

  1. 如何使 WebAPI 自动生成漂亮又实用在线API文档

    1.前言 1.1 SwaggerUI SwaggerUI 是一个简单的Restful API 测试和文档工具.简单.漂亮.易用(官方demo).通过读取JSON 配置显示API. 项目本身仅仅也只依赖 ...

  2. vs2010代码注释自动生成api文档

    最近做了一些接口,提供其他人调用,要写个api文档,可是我想代码注释已经写了说明,能不能直接把代码注释生成api?于是找到以下方法 环境:vs2010 先下载安装Sandcastle 和Sandcas ...

  3. grunt api 文档

    Grunt docs Grunt和 Grunt 插件是通过 npm 安装并管理的,npm是 Node.js 的包管理器. 安装 grunt-cli npm install grunt-cli -g 注 ...

  4. 自动生成api文档

    vs2010代码注释自动生成api文档 最近做了一些接口,提供其他人调用,要写个api文档,可是我想代码注释已经写了说明,能不能直接把代码注释生成api?于是找到以下方法 环境:vs2010 先下载安 ...

  5. WebApi生成在线API文档--Swagger

    1.前言 1.1 SwaggerUI SwaggerUI 是一个简单的Restful API 测试和文档工具.简单.漂亮.易用(官方demo).通过读取JSON 配置显示API. 项目本身仅仅也只依赖 ...

  6. SpringBoot入门教程(二十)Swagger2-自动生成RESTful规范API文档

    Swagger2 方式,一定会让你有不一样的开发体验:功能丰富 :支持多种注解,自动生成接口文档界面,支持在界面测试API接口功能:及时更新 :开发过程中花一点写注释的时间,就可以及时的更新API文档 ...

  7. SpringBoot系列: 使用 Swagger 生成 API 文档

    SpringBoot非常适合开发 Restful API程序, 我们都知道为API文档非常重要, 但要维护好难度也很大, 原因有: 1. API文档如何能被方便地找到? 以文件的形式编写API文档都有 ...

  8. android api文档:intent阅读笔记

    intent是几大组件之间进行通信的组件.可以包含以下几个部分: component:指明了处理该intent的对象. Action类似于一个函数名,规定了其他部分的对应用法: The action ...

  9. geoserver整合swagger2支持自动生成API文档

    网上各种博客都有关于swagger2集成到springmvc.springboot框架的说明,但作者在整合到geoserver中确碰到了问题,调试一番最后才解决,遂总结一下. swagger2集成只需 ...

  10. gateway聚合swagger3统一管理api文档

    springboot微服务整合swagger3方法很简单,下文会演示.但是在分布式项目中如果每个微服务都需要单独的分开访问获取接口文档就不方便了,本文将详细讲解springcloud gateway网 ...

随机推荐

  1. Redis进阶实践之七Redis和Lua初步整合使用

    一.引言        Redis学了一段时间了,基本的东西都没问题了.从今天开始讲写一些redis和lua脚本的相关的东西,lua这个脚本是一个好东西,可以运行在任何平台上,也可以嵌入到大多数语言当 ...

  2. 未找到约束ContractName Microsoft.VisualStudio.Text.ITextDocumentFactoryServiceRequiredTypeIdentity匹配的导出的解决办法

    未找到约束ContractName Microsoft.VisualStudio.Text.ITextDocumentFactoryServiceRequiredTypeIdentity Micros ...

  3. 006-接收键盘的输入(read)

    read  -ptns   变量名 -p 在等待read输入的时候,显示的提示信息 -t 秒数,read等待用户输入的时间 -n read接收用户输入的字符数,只接收指定字符数,就会执行 -s 隐藏输 ...

  4. mysq开启慢查询

    1 将未建立索引的sql放到慢查询日志中 查看 log_queries_not_using_indexes 是否为on show variables like 'log%'; 将 log_querie ...

  5. linkin大话面向对象--闭包和回调

      先来理解2个概念:闭包和回调   什么是闭包? 闭包是一个可调用的对象,它记录了一些信息,这些信息来自于创建他的作用域.通过这个定义,可以看出内部类是面向对象的闭包,因为他不仅包含了外部类对象的信 ...

  6. android 弹起键盘把ui顶上去的解决办法

    键盘输入框上面的ui布局必须为Relative相对布局.然后设置 <activityandroid:name=".activity.HomeActivity"Android: ...

  7. awk使用正则精确匹配

    [root@localhost home]# cat file 5001][YRSD5-1][YRSD5-1-2][0203008400028411] 010102 5001][YRSD7-1][YR ...

  8. Linux Shell 文件描述符 及 stdin stdout stderr 重定向

    Abstract: 1) Linux Shell 命令的标准输入.标准输出.标准错误,及其重定位: 2)Linux Shell 操作自定义文件描述符: 文件描述符是与文件相关联的一些整数,他们保持与已 ...

  9. .Net 更容易的使用配置文件 SuperConfig

    一.原始配置文件的问题 我们在做开发时,不管是B/S还是C/S,现在几乎所有的项目都会碰到使用配置文件,简单点的如链接字符串.上传路径啊,一些API的接口地址等等.复杂点就更多了,如ActiveMQ的 ...

  10. javascript中this指向问题

    本文参考http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html this是JavaScript的一个关 ...