方块式可视化列表
block-list
方块式可视化列表
API
| 参数名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| dataSource | 数据源，dataSource 中存在 backIconType 时，展示 Icon 组件为背景图 | Array | - |
| primaryKey | 唯一标识 | string | id |
| size | 指定方块大小 可选值 small, medium, large |
Enum/Number | 'medium' |
| selectedKeys | （用于受控）当前选中节点 key 的数组 | Array | - |
| defaultSelectedKeys | （用于非受控）默认选中节点 key 的数组 | Array | - |
| onSelect | 选中或取消选中节点时触发的回调函数，回传 keys,infos | Function | - |
| highlightKeys | 高亮色块 | Array | - |
| labelRender | 色块内文本 render | Function | (block) => block.label |
| disabled | 是否全局禁用色块选择 | Boolean | false |
| disabledRender | 色块是否禁用选择 render | Function | (block) => block.disabled |
| boxProps | Box 组件属性透传 | Object | - |
| tagProps | Tag.Selectable 组件属性透传 | Object | - |
| isSearch | 是否处于搜索模式，一般是有关键字或过滤条件时传为 true，该模式下所有色块变透明，highlightKeys 对应的色块高亮；否则所有色块无透明和高亮效果 | Boolean | false |
change log
-- 2021.09.01
---- 1. 还原上一次处理（色块全部高亮时，禁用的色块透明度为 0.5），即禁用色块高亮效果与其他色块一致，无特殊处理；
-- 2021.08.31
---- 1. dataSource 数据中增加 backIconType 字段，存在该字段时，组件中设置 Icon 组件的 type，且作为背景图显示；
---- 2. 背景图的大小目前为固定的 27px;
---- 3. 禁用的色块去掉背景颜色的设置，只保留鼠标手势和事件禁用；
---- 4. IP 地址功能中对禁用的色块，应同时设置 backIconType 和 disabled；
---- 5. 去掉色块 4px 的圆角，使用 tag 组件本身的 2px 的圆角；
---- 6. 更新“受控展示”demo 中的颜色色值；
---- 7. 色块全部高亮时，禁用的色块透明度为 0.5；
---- 8. 色块选中的样式修改，tag 组件选中三角的背景色改为白色，对勾颜色使用父级色块的颜色；
-- 2021.08.23
---- 1. 修改框选时遮罩的计算逻辑，兼容多层级定位布局；
---- 2. 兼容内滚出现滚动条时的框选；
-- 2021.08.20
---- 1. 添加 disabled 属性与 demo 样例，可全局设置或在 dataSource 中单项设置；
---- 2. 被 disabled 的色块组件内部不会做处理，保持原 disabled 设置与选中的项进行回调；
-- 2021.08.10
---- 1. 处理清空场景下，传 selectedKeys=[]不生效的问题；
---- 2. 主动修改 selectedKeys 时，不回调 onChange 事件，防止循环调用；
---- 3. 重复选择相同 key 时，不响应 onChange 事件
-- 2021.08.04
---- 1. 添加鼠标滑选特效；
---- 2. 取消 selectMode 参数，点击为单选，ctrl/command 按住单击为多选，鼠标按住拖动为滑选；
---- 3. 取消 boxProps 参数，内部取消了 Box 组件；
---- 4. 取消 onSelect 方法回调时的第二个参数，原因为：内部实现方法改动，暂无法获取当前节点数据，后续版本再支持；
---- 5. 由于增加了鼠标滑选操作，单击时如果鼠标抖动会认为是滑选操作，可能会引起选中又取消的现象；