使用插件
cdList 绝大部分是对插件的操作进行处理,每种插件看似独立却又存在着联系,例如:
- 当进行筛选后需要对分页插件进行重置
- 改变搜索关键字后,需要重置筛选和分页
- 改变筛选后需要重置排序
- .......
所以,CdList 尽量提供各种完善的插件共开发者使用,同时保留开发自定义插件的能力
实例化插件
① 直接 new
即可立即创建一个插件实例,不过想让插件可用必须将其放入一个 CdList 实例中。
var search = new CdList.addons.Search({
btnText: '查询',
historyEnable: 1
});
var cdlist = new CdList({
//....
addons: [search]
//...
});
② 后续的开发中即可根据需求调用插件的 Api, 对于 Search
插件,开发者可以调用 setValue
,改变检索关键字;其效果跟用户点击搜索按钮一致。
search.setValue('ruby')
插件的通用配置
① 设置 container
可以让插件展示在你想要的位置,不然程序会自动安排插件的展示位置
var search = new CdList.addons.Search({
container: '#my-search-wrap',
btnText: '查询'
});
② 设置 historyEnable: 1
可以让插件开启 history 记录功能,前提是你的浏览器支持,如果不支持将会
通过刷新页面改变 url
var search = new CdList.addons.Search({
container: '#my-search-wrap',
btnText: '查询',
historyEnable: 1
});
③ 设置 historyKey
可以改变默认的 url param,例如:分页插件会将 page
作为 param,如果此参数有其他意义,开发者可以对其进行变更
有些多参数的插件需要设置多个 historyKey,具体设置方式参见对应插件的 API
/**
* 分页改变后 url 类似:
* /{path}/?mypage=2
*/
var pg = window.pg = new CdList.addons.Pagination({
historyEnable: 1,
historyKey: 'mypage',
getSetting: function (json) {
if (json) {
return {
total: 3
}
}
}
});