本文主要介绍了SpreadJS的项目切片器。
工具/原料
纯前端表格控件:SpreadJS
方法/步骤
1
SpreadJS提供项目切片器, 项目切片器实现了与内置表格切片器相同的筛选界面,可以通过简单的设置在SpreadJS外部完成数据的筛选。
2
项目切片器是一个独立的切片器控件,并不依赖SpreadJS,你可以在页面的任何地方添加项目切片器。
3
项目切片器需要与切片器数据模块相配合(包括通用切片器数据,表格切片器数据或者其他基于通用切片器数据实现的切片器数据)。如果项目切片器与表格切片器配合使用,当项目切片器发生筛选动作,表格上的数据也会随之同步。
4
你可以通过以下步骤构建自己的项目切片器:
方法/步骤2
1
构建数据源和通用切片器数据
2
获取列数据并构建呈现界面。
3
获取筛选结果并更新呈现界面。
4
构建项目切片器,并将通用切片器数据附加在切片器上,并将其置于页面的DOM 树结构中。END
方法/步骤3
效果展示