element-plus/assets/en-US_component_tree.md.395f4c6d.js

2 lines
276 KiB
JavaScript
Raw Normal View History

2022-03-29 22:52:56 +08:00
import{_ as C,a as E,b as c,c as l,d as r,e as D,f as u,g as k,h as i,i as F,j as d}from"./chunks/selectable.ced7c45c.js";import{c as A,a as p,w as e,u as o,b as n,d as a,e as y,r as h,o as g}from"./app.e5926f2b.js";const B=n("h1",{id:"tree",tabindex:"-1"},[a("Tree "),n("a",{class:"header-anchor",href:"#tree","aria-hidden":"true"},"#")],-1),b=n("p",null,"Display a set of data with hierarchies.",-1),m=n("h2",{id:"basic-usage",tabindex:"-1"},[a("Basic usage "),n("a",{class:"header-anchor",href:"#basic-usage","aria-hidden":"true"},"#")],-1),f=n("p",null,"Basic tree structure.",-1),v=n("p",null,"tree/basic",-1),w=n("h2",{id:"selectable",tabindex:"-1"},[a("Selectable "),n("a",{class:"header-anchor",href:"#selectable","aria-hidden":"true"},"#")],-1),L=n("p",null,"Used for node selection.",-1),N=n("p",null,"tree/selectable",-1),_=n("h2",{id:"custom-leaf-node-in-lazy-mode",tabindex:"-1"},[a("Custom leaf node in lazy mode "),n("a",{class:"header-anchor",href:"#custom-leaf-node-in-lazy-mode","aria-hidden":"true"},"#")],-1),x=n("p",null,"tree/custom-leaf",-1),T=n("h2",{id:"disabled-checkbox",tabindex:"-1"},[a("Disabled checkbox "),n("a",{class:"header-anchor",href:"#disabled-checkbox","aria-hidden":"true"},"#")],-1),q=n("p",null,"The checkbox of a node can be set as disabled.",-1),j=n("p",null,"tree/disabled",-1),P=n("h2",{id:"default-expanded-and-default-checked",tabindex:"-1"},[a("Default expanded and default checked "),n("a",{class:"header-anchor",href:"#default-expanded-and-default-checked","aria-hidden":"true"},"#")],-1),z=n("p",null,"Tree nodes can be initially expanded or checked",-1),S=n("p",null,"tree/default-state",-1),I=n("h2",{id:"checking-tree-nodes",tabindex:"-1"},[a("Checking tree nodes "),n("a",{class:"header-anchor",href:"#checking-tree-nodes","aria-hidden":"true"},"#")],-1),R=n("p",null,"tree/checking-tree",-1),K=n("h2",{id:"custom-node-content",tabindex:"-1"},[a("Custom node content "),n("a",{class:"header-anchor",href:"#custom-node-content","aria-hidden":"true"},"#")],-1),U=n("p",null,"The content of tree nodes can be customized, so you can add icons or buttons as you will",-1),O=n("p",null,"tree/customized-node",-1),V=n("h2",{id:"custom-node-class",tabindex:"-1"},[a("Custom node class "),n("a",{class:"header-anchor",href:"#custom-node-class","aria-hidden":"true"},"#")],-1),M=n("p",null,"The class of tree nodes can be customized",-1),H=n("p",null,"tree/custom-node-class",-1),J=n("h2",{id:"tree-node-filtering",tabindex:"-1"},[a("Tree node filtering "),n("a",{class:"header-anchor",href:"#tree-node-filtering","aria-hidden":"true"},"#")],-1),X=n("p",null,"Tree nodes can be filtered",-1),Y=n("p",null,"tree/filtering",-1),G=n("h2",{id:"accordion",tabindex:"-1"},[a("Accordion "),n("a",{class:"header-anchor",href:"#accordion","aria-hidden":"true"},"#")],-1),Q=n("p",null,"Only one node among the same level can be expanded at one time.",-1),W=n("p",null,"tree/accordion",-1),Z=n("h2",{id:"draggable",tabindex:"-1"},[a("Draggable "),n("a",{class:"header-anchor",href:"#draggable","aria-hidden":"true"},"#")],-1),$=n("p",null,[a("You can drag and drop Tree nodes by adding a "),n("code",null,"draggable"),a(" attribute.")],-1),n2=n("p",null,"tree/draggable",-1),a2=y('<h2 id="attributes" tabindex="-1">Attributes <a class="header-anchor" href="#attributes" aria-hidden="true">#</a></h2><table><thead><tr><th>Attribute</th><th>Description</th><th>Type</th><th>Accepted Values</th><th>Default</th></tr></thead><tbody><tr><td>data</td><td>tree data</td><td>array</td><td>\u2014</td><td>\u2014</td></tr><tr><td>empty-text</td><td>text displayed when data is void</td><td>string</td><td>\u2014</td><td>\u2014</td></tr><tr><td>node-key</td><td>unique identity key name for nodes, its value should be unique across the whole tree</td><td>string</td><td>\u2014</td><td>\u2014</td></tr><tr><td>props</td><td>configuration options, see the following table</td><td>object</td><td>\u2014</td><td>\u2014</td></tr><tr><td>render-after-expand</td><td>whether to render child nodes only after a parent node is expanded for the first time</td><td>boolean</td><td>