CheckedTreeModel

一个树形结构数据的 checked 状态变化的数据模型. 返回一个 Diff 状态变化集合. 参考 antdTree 组件.

Example

Live Demo

Quick Start

import CheckedTreeModel from '@zstark/checked-tree-model'; const mock = { id: 0, name: 'title1', childList: [ { id: 1, name: 'title2' }, { id: 2, name: 'title3' }, ], }; const data = new CheckedTreeModel(mock); data.setCheckedByIdReturnDiff(1); // => { 0: { indeterminate: true }, 1: { checked: true } } data.setCheckedByIdReturnDiff(2); // => { 0: { checked: true, indeterminate: false }, 2: { checked: true } } constructor

(options: Data, parent?: CheckedTreeModel) => void

export interface Data { id: string | number; pId: string | number; name: string; childList: Data[]; className?: string; level: number; expand?: boolean; } export type Diff = { [P: string]: { indeterminate?: boolean; checked?: boolean; }; }; type EachCallback = ( data: CheckedTreeModel, parent: CheckedTreeModel, index: number, ) => void; type Undown = boolean; // 初始化的时候, 是否强关联(向下遍历). Methods isRoot: () => boolean. 是否是根元素 diff: () => { indeterminate?: boolean; checked?: boolean;} | undefined. 当前数据变化状态 setChecked: () => CheckedTreeModel. 选中当前数据. setIndeterminate: () => CheckedTreeModel. 半选. setCheckedByIdReturnDiff: (id?: Data['id'], value?: boolean, undown?: boolean) => {} selectKeys: (keys: Ids, undown?: boolean) => Diff. 根据 ID 数组设置选中 getSelectKeys: () => Ids. 获取当前树所有选中的 ID. clean: () => Diff. 清空当前树所有状态. each: (fn: EachCallback) => void. 遍历子元素. eachDeep: (fn: EachCallback) => void. 递归遍历子元素. 回调在递归前. eachDeepAfter: (fn: EachCallback) => void. 递归遍历子元素. 回调在递归后.

版权声明:

1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。
2、网站不提供资料下载,如需下载请到原作者页面进行下载。