123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159 |
- import { defineProps } from '../../libs/util/props';
- import theme from '../../libs/config/theme.js'
- export default defineProps('tree', {
- // 数据
- data: {
- type: Array,
- default: () => []
- },
- // 选项名称映射的字段名
- keyField: {
- type: String,
- default: 'key'
- },
- // 展示值映射的字段名
- labelField: {
- type: String,
- default: 'label'
- },
- // 子级值映射的字段名
- childrenField: {
- type: String,
- default: 'children'
- },
- // 是否是叶子节点的字段名
- isLeafField: {
- type: String,
- default: 'isLeaf'
- },
- // 是否禁用的字段名
- disabledField: {
- type: String,
- default: 'disabled'
- },
- // 默认选中多选项
- defaultCheckedKeys: {
- type: Array,
- default: () => []
- },
- // 默认展开项
- defaultExpandedKeys: {
- type: Array,
- default: () => []
- },
- // 受控的选中多选项
- checkedKeys: {
- type: Array,
- default: undefined
- },
- // 受控的展开项
- expandedKeys: {
- type: Array,
- default: undefined
- },
- // 是否可选择
- checkable: {
- type: Boolean,
- default: false
- },
- // 是否可选择
- selectable: {
- type: Boolean,
- default: false
- },
- // 是否级联
- cascade: {
- type: Boolean,
- default: false
- },
- // 是否允许点击节点展开/收缩
- expandOnClick: {
- type: Boolean,
- default: false
- },
- // 是否允许点击节点勾选/取消勾选
- checkOnClick: {
- type: Boolean,
- default: false
- },
- // 异步加载节点数据
- loadNode: {
- type: Function,
- default: null
- },
- // 是否允许勾选未加载的节点
- allowCheckingNotLoaded: {
- type: Boolean,
- default: false
- },
- // 搜索过滤
- pattern: {
- type: String,
- default: ''
- },
- // 是否显示搜索无关的节点
- showIrrelevantNodes: {
- type: Boolean,
- default: true
- },
- // 外观
- indentWidth: {
- type: [Number, String],
- default: 24
- },
- // 是否显示展开/收缩按钮
- showSwitcher: {
- type: Boolean,
- default: true
- },
- // 展开图标
- expandIcon: {
- type: String,
- default: 'arrow-right-fill'
- },
- // 收缩图标
- collapseIcon: {
- type: String,
- default: 'arrow-down-fill'
- },
- // loading的颜色
- loadingColor: {
- type: String,
- default: ''
- },
- // checkebox选中颜色
- checkedColor: {
- type: String,
- default: ''
- },
- // 是否可旋转展开/收缩按钮
- rotatableSwitcher: {
- type: Boolean,
- default: false
- },
- // 高亮背景颜色
- highlightBgColor: {
- type: String,
- default: '#f9ae3d'
- },
- // 选中背景颜色
- selectedBgColor: {
- type: String,
- default: '#f3f4f6'
- },
- // 展开/收缩按钮大小
- switcherSize: {
- type: [Number, String],
- default: 14
- },
- // 展开/收缩按钮颜色
- switcherColor: {
- type: String,
- default: '#909399'
- }
- })
|