单元格状态的用法
背景:以前有小伙伴交流过,希望能加入一些“特效”来提高用户的UI体验,
例如针对一些特殊状态的单元格做一些样式标记,或鼠标hover效果等。
在V13以前的版本中,只能通过条件格式、事件、甚至自定义单元格等方式来实现,
实现方式比较复杂,一些样式还可能会被导出到Excel中,这是不希望看到的。
SpreadJS 自V13版本以来,开始支持“单元格状态”这个新功能,
单元格状态提供有关单元格如何响应用户不同操作的信息,例如在编辑,悬停,只读,以及其他方法,
具体取决于单元格状态,将不同的样式应用于指定的区域。
也就是说,以下单元格状态,做了原生的样式响应支持:
类型 含义
hover 鼠标悬停在单元格上方
invalid 数据验证失败
readonly 单元格被锁定
edit 单元格正在编辑中。
active 单元格具有焦点
selected 单元格(可为多个)在已选择的范围内。
需要注意的是,这些类型如果设置了多重的状态样式,是有优先级区别的,具体顺序是:
编辑 > 悬停 > 选择 > 激活 > 无效 > 只读;
参考示例:
https://demo.grapecity.com.cn/spreadjs/SpreadJSTutorial/features/cell-state/priority-cell-states/purejs
页:
[1]