# void-tree

**Repository Path**: white-kite/void-tree

## Basic Information

- **Project Name**: void-tree
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-05-07
- **Last Updated**: 2022-11-28

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# void-tree


![npm (scoped)](https://img.shields.io/npm/v/void-tree?style=flat-square)

**一个简陋的树型数据工具**

_只是个人项目，整体较为随便，作为开发途中的经验总结，如有相似的需求，推荐copy或阅读源码，不建议将该包在实际项目中使用_

**如有幸被实际使用在项目内，不胜荣幸**

> 灵感是[treemate](https://treemate.vercel.app/)

### 初衷

围绕树状数据解析，总结使用一些组件库的tree组件时的通用业务

一开始想到了使用 [naiveui](https://www.naiveui.com/) 团队开源的 [treemate](https://treemate.vercel.app/)

但[treemate](https://treemate.vercel.app/)无法做到在递归时自定义一些行为

并且个人需求只是围绕树状数据解析

这个简陋至极的包也因此孕育而生

### 使用

```ts
/**
 *  一个占位，返回空空如也的模型
 */
createInitVoidTree()

/**
 * 通过一个单层列表构造树状结构
 * [{
 *    id: 0,
 *    parentId: -1
 * }]
 * 需拥有类似的数据结构
 */
createVoidTreeByList()

/**
 * 构造树状模型
 */
createVoidTree()
```

### 数据模型

```ts
interface TreeNode<Raw extends Record<string, any>> {
  key: Key;
  label: string;
  raw: Raw;
  level: number;
  index: number;
  parent?: TreeNode<Raw>;
  disabled: boolean;
  isLeaf: boolean;
  path: Key[];
  siblings: Array<TreeNode<Raw>>;
  children?: Array<TreeNode<Raw>>;
  [key: string]: any;
}

declare class VoidTree<Raw> {
  /**
   * 处理后对外展示的数据
   */
  treeNodes: TreeNode<Raw>[];
  /**
   * 自定义的一些缓存
   */
  cache: TreeCache<Raw>;
  /**
   * 选择的key值
   */
  checkKeys: Key[];
  constructor(treeNodes: TreeNode<Raw>[], cache: TreeCache<Raw>);
  /**
   * 获取某项缓存
   * @param key
   */
  getCache(key: string): any;
  /**
   * 获取key-node 结构的Map数据
   */
  get treeNodeMap(): Map<Key, TreeNode<Raw>>;
  /**
   * 通过key获取单个节点信息
   * @param key
   */
  getNode(key: Key): TreeNode<Raw> | undefined;
  /**
   * 通过多个key获取多个节点信息
   * @param key
   * @param ignoreEmpty
   */
  getNodes(key: Key | Key[], ignoreEmpty?: boolean): TreeNode<Raw>[];
  /**
   * 获取子节点
   * @param key
   */
  getChild(key: Key): TreeNode<Raw>[] | undefined;
  /**
   * 获取父节点
   * @param key
   */
  getParent(key: Key): TreeNode<Raw> | undefined;
  /**
   * 选择
   * @param key
   */
  check(key: Key | Key[]): void;
  /**
   * 选择
   * @param key
   */
  uncheck(key: Key | Key[]): void;
  /**
   * 选择
   * @param key
   */
  updateCheckKeys(key: Key | Key[]): void;
  /**
   * 自定义选择
   * @param fn
   */
  customUpdateCheckKeys(fn: (self: VoidTree<Raw>) => Key | Key[]): void;
  /**
   * 搜索
   * 解决一些组件库tree搜索不会筛选数据，而是加下划线
   * 方法改写自naiveui
   * @param keyword
   * @param filter
   */
  search(keyword: string, filter?: (pattern: string, v: string) => boolean): void;
}
```