li-virtual-treeselect

Project setup

npm install npm i li-virtual-treeselect

main.js 全局注册

import LiVirtualTreeSelect from 'li-virtual-treeselect'
import 'li-virtual-treeselect/lib/li-virtual-treeselect.css'

Vue.use(LiVirtualTreeSelect);

页面简单使用

<LiVirtualTreeSelect v-model="id" :options="options" :isSearch="true" :treeMap="{label:"title",value:"id"}">
    
</LiVirtualTreeSelect>

Customize configuration

See Configuration Reference.

📦 安装（两步，缺一不可）

重要：本组件核心功能基于 @sangtian152/virtual-tree 虚拟树组件。安装本组件前，必须先行安装该依赖。

npm 7+ 会自动安装 @sangtian152/virtual-tree npm 6 及更早版本需手动安装 @sangtian152/virtual-tree

第一步：安装核心依赖

npm install @sangtian152/virtual-tree

2. 核心组件
li-virtual-treeselect.vue: 主组件文件，实现了虚拟滚动树选择器
依赖库: 使用了 @sangtian152/virtual-tree 作为底层虚拟树实现


3. 组件特性
虚拟滚动: 通过 @sangtian152/virtual-tree 实现大数据量下的高性能渲染
搜索功能: 支持输入框搜索，具有防抖机制
树形结构展示: 支持展开/收起节点
选中高亮: 当前选中项会有特殊样式标识
自定义插槽: 支持通过插槽自定义节点内容展示