v-treeview
组件对于显示大量嵌套数据很有用。
下面是一些简单到复杂的例子。
密集模式提供了更紧凑的布局,同时降低了项目的高度。
您可以控制所选节点复选框的颜色。
您可以控制活动的树形视图节点的文本和背景颜色。
形状的树形视图在节点的一侧具有圆形边界。
您可以使树视图节点变成圆角。
设置 item-disabled
属性可当设置为 true
时,以控制哪个节点的属性会禁用该节点。
树形视图现在支持两种不同的选择类型。 默认类型是 'leaf',它仅在 v-model 数组中包括叶节点,但会将父节点呈现为部分或完全选择状态。 另一种模式是 'independent',它允许选择一个父节点,但是每个节点都独立于其父节点和子节点。
您可以轻松选择树形视图节点和子节点。
树形视图节点可以将其激活。
树形视图节点可以具有悬停效果。
树形视图节点可以在页面加载时预先打开。
使用插槽,我们可以创建一个直观的文件浏览器。 除了 prepend
插槽外,还有一个用于 label
和 append
插槽。
使用 search 属性轻松过滤您的树形视图。 如果需要区分大小写或模糊过滤,可以通过设置 filter 属性轻松地应用自定义过滤功能。 这类似于 v-autocomplete 组件。
您可以通过向 load-children
属性提供 Promise 回调来动态加载子数据。 用户首次尝试扩展具有子属性(为空数组)的项目时,将执行此回调。
为您的可选树形视图自定义 on, off 和 indeterminate 图标。 与其他高级功能(如 API 加载项)结合使用。
Caught a mistake or want to contribute to the documentation?
Edit Layout
on GitHub!