vue-treeselect

一、属性及属性值

属性 类型 默认值 用途
allowClearingDisabled Boolean false 是否允许重置值,即使有禁用的选定节点
allowSelectingDisabledDescendants Boolean false

当选择/取消选择祖先节点时,是否应选择/取消选中其禁用的后代

可与allowClearingDisabled道具结合使用。

alwaysOpen Boolean false 菜单是否应该始终打开
appendToBody Boolean false 将菜单附加到<body/>
async Boolean false 是否启用异步搜索模式
autoFocus Boolean false 自动将组件聚焦到装载上
autoLoadRootOptions Boolean false 在装载时自动加载根选项。当设置为false时,打开菜单时将加载根选项。
autoDeselectAncestors Boolean false 当用户取消选择节点时,会自动取消选择其祖先。仅适用于平面模式
autoDeselectDescendants 当用户取消选择节点时,会自动取消选择其子代。仅适用于平面模式
autoSelectAncestors 当用户选择一个节点时,会自动选择其祖先。仅适用于平面模式
autoSelectDescendants 当用户选择一个节点时,会自动选择其子节点。仅适用于平面模式
backspaceRemoves 如果没有文本输入,Backspace是否会删除最后一项
beforeClearAll 在清除所有输入字段之前进行处理的函数。返回false以停止清除值
branchNodesFirst 在叶节点之前显示分支节点
cacheOptions 是否缓存异步搜索模式下每个搜索请求的结果
clearable 是否显示重置值的“×”按钮
clearAllText 当:multiple=“true”时,“×”按钮的标题
clearOnSelect 选择选项后是否清除搜索输入。仅在以下情况下使用:multiple=“true”。对于单选模式,无论道具值如何,它总是在选择后清除输入
clearValueText “×”按钮的标题
closeOnSelect 选择选项后是否关闭菜单。仅在以下情况下使用:multiple=“true”
defaultExpandLevel 加载时应自动扩展多少级分支节点。设置“无限”使所有分支节点默认展开
defaultOptions 在用户开始搜索之前显示的默认选项集。用于异步搜索模式。当设置为true时,搜索查询的结果将作为空字符串自动加载
deleteRemoves 如果没有文本输入,删除是否会删除最后一项
delimiter 用于连接隐藏字段值的多个值的分隔符
disableBranchNodes Boolean false 只能选择末级节点
disabled 是否禁用控件
disableFuzzyMatching 设置为true可禁用默认启用的模糊匹配功能
flat 是否启用平面模式
flattenSearchResults 是否在搜索时展平树(仅同步搜索模式)
instanceId 将所有事件作为最后一个参数传递。可用于识别事件来源
joinValues 使用分隔符将多个值连接到一个表单字段中(传统模式)
limit 限制所选选项的显示。其余部分将隐藏在limitText字符串中
limitText 处理所选元素超过定义限制时显示的消息的函数
loadingText String "Loading..." 加载选项时显示的文本
loadOptions  Fn({actioncallbackparentNode?instanceId}) 🡒 (void | Promise) - 用于动态加载选项。请参阅此处了解详细信息。
可能的操作值:“LOAD_ROOT_OPTIONS”、“LOAD_CHILDREN_OPTIONS“或“ASYNC_SEARCH”。
callback-一个接受可选错误参数的函数
parentNode-仅在加载子选项时显示
searchQuery-仅在搜索异步选项时显示
instanceId-等于您传递给vue-treeselect的instanceId属性的值
matchKeys  String[] [ "label" ] 要过滤节点对象的哪些键
maxHeight Number 300 设置菜单的maxHeight样式值
multiple Boolean false 设置为true以允许选择多个选项(即多选模式)
name String - 为html表单生成一个带有此字段名的隐藏<input/>标签
noChildrenText String "No sub-options." 分支节点没有子节点时显示的文本
noOptionsText String "No options available." 没有可用选项时显示的文本
noResultsText String "No results found..." 当没有匹配的搜索结果时显示的文本
normalizer Fn(nodeinstanceId) 🡒 node node => node 于规范化源数据
openDirection String "auto" 默认情况下(“自动”),菜单将在控件下方打开。如果没有足够的空间,vue-treeselect将自动翻转菜单。您可以使用其他四个选项之一强制菜单始终向指定方向打开。
可接受值:"auto""below""bottom""above" or "top"
openOnClick Boolean true 单击控件时是否自动打开菜单
openOnFocus Boolean false 控件聚焦时是否自动打开菜单
options node[] - 可用选项数组
placeholder String "Select..." 字段占位符,当没有值时显示
required Boolean false 需要时应用HTML5必需属性
retryText String "Retry?" 显示的文本询问用户是否重试加载子选项。
retryTitle String "Click to retry" 重试按钮的标题。
searchable Boolean true 是否启用搜索功能
searchNested Boolean false 如果搜索查询也应在所有祖先节点中搜索,则设置为true。
searchPromptText 提示异步搜索的文本提示。用于异步搜索模式。
showCount Boolean false 是否在每个分支节点的标签旁边显示子计数。
showCountOf Boolean - 与showCount结合使用,指定应显示哪种类型的计数。
可接受值:“ALL_CHILDREN”、“ALL_DESENDANTS”、“LEAF_CHILDREN”或“LEAF_DESCENDANTS”。
showCountOnSearch 搜索时是否显示子节点数。未指定时回退到showCount的值。
sortValueBy String "ORDER_SELECTED" 所选选项应按何种顺序显示在触发器中并按值数组排序。仅在以下情况下使用:multiple=“true”。例如,请参见此处。
可接受的值:“ORDER_SELECTED”、“LEVEL”或“INDEX”。
tabIndex Number 0 控件的选项卡索引。
value id | node | id[] | node[] - 控制的价值。
当:multiple=“false”时,应为id或节点对象,当:multiply=“true”时,则应为id数组或节点对象。其格式取决于valueFormat属性。
在大多数情况下,只需使用v-model即可。
valueConsistsOf String "BRANCH_PRIORITY" 在多选模式下,值数组中应包含哪种节点。
可接受值:"ALL""BRANCH_PRIORITY""LEAF_PRIORITY" or "ALL_WITH_INDETERMINATE"
valueFormat String "id" 值道具的格式。
请注意,当设置为“object”时,值中的每个节点对象只需要id和标签属性。
可接受的值:“id”或“object”。
zIndex Number | String 999 菜单的z-index

 

 

 

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-20 15:54:02       52 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-20 15:54:02       54 阅读
  3. 在Django里面运行非项目文件

    2024-07-20 15:54:02       45 阅读
  4. Python语言-面向对象

    2024-07-20 15:54:02       55 阅读

热门阅读

  1. 反悔贪心

    2024-07-20 15:54:02       19 阅读
  2. 我们的耳穴项目迈进了一大步

    2024-07-20 15:54:02       21 阅读
  3. 【前后端联调】HttpMessageNotReadableException

    2024-07-20 15:54:02       19 阅读
  4. 恒等式结论

    2024-07-20 15:54:02       15 阅读
  5. Https post 请求时绕过证书验证方案

    2024-07-20 15:54:02       20 阅读
  6. 素数极差

    2024-07-20 15:54:02       15 阅读
  7. 数据结构——栈

    2024-07-20 15:54:02       17 阅读
  8. 量化交易对短期收益的提升效果

    2024-07-20 15:54:02       17 阅读
  9. ArcGIS Pro SDK (九)几何 9 立方贝塞尔线段

    2024-07-20 15:54:02       15 阅读
  10. glibc: getifaddrs_internal 占用大量cpu

    2024-07-20 15:54:02       13 阅读
  11. 【关于使用swoole的知识点整理】

    2024-07-20 15:54:02       14 阅读