element-gui
Version:
A Component Library for Vue.js.
1,327 lines (1,326 loc) • 431 kB
JSON
{
"framework": "vue",
"name": "element-gui",
"version": "1.11.5",
"description-markup": "markdown",
"contributions": {
"html": {
"vue-components": [
{
"name": "ElAffix",
"description": "将元素钉在固定位置,常用于顶部菜单或者侧边菜单。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|offset-top|距离窗口顶部达到指定偏移量后触发|number|—|0|\n|offset-bottom|距离窗口底部达到指定偏移量后触发|number|—|—|\n|target|设置 `Affix` 需要监听其滚动事件的元素,值为一个返回对应 `DOM` 元素的函数|function|—|() => window|\n",
"events-table": "|事件名称|说明|回调参数|\n|:---|:---|:---|\n|change|在固定状态发生改变时触发|固定则为 `true`,否则为 `false`|\n",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/affix",
"props": [
{
"name": "offset-top",
"description": "距离窗口顶部达到指定偏移量后触发",
"type": "number",
"default": "0"
},
{
"name": "offset-bottom",
"description": "距离窗口底部达到指定偏移量后触发",
"type": "number"
},
{
"name": "target",
"description": "设置 `Affix` 需要监听其滚动事件的元素,值为一个返回对应 `DOM` 元素的函数",
"type": "function"
}
],
"js": {
"events": [
{
"name": "change",
"description": "在固定状态发生改变时触发"
}
]
}
},
{
"name": "ElAlert",
"description": "用于页面中展示重要的提示信息。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|title|标题|string|—|—|\n|type|主题|string|`primary` / `success` / `warning` / `info` / `error`|primary|\n|description|辅助性文字,也可通过默认 `slot` 传入|string|—|—|\n|closable|是否可关闭|boolean|—|true|\n|center|文字是否居中|boolean|—|false|\n|close-text|关闭按钮自定义文本|string|—|—|\n|show-icon|是否显示图标|boolean|—|false|\n|effect|选择提供的主题|string|`light` / `dark`|light|\n",
"events-table": "|事件名称|说明|回调参数|\n|:---|:---|:---|\n|close|关闭 `Alert` 时触发的事件|—|\n",
"methods-table": "",
"slots-table": "|名称|说明|\n|:---|:---|\n|default|描述|\n|title|标题的内容|\n",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/alert",
"props": [
{
"name": "title",
"description": "标题",
"type": "string"
},
{
"name": "type",
"description": "主题",
"type": "string",
"enum": "primary / success / warning / info / error",
"default": "primary"
},
{
"name": "description",
"description": "辅助性文字,也可通过默认 `slot` 传入",
"type": "string"
},
{
"name": "closable",
"description": "是否可关闭",
"type": "boolean",
"default": "true"
},
{
"name": "center",
"description": "文字是否居中",
"type": "boolean",
"default": "false"
},
{
"name": "close-text",
"description": "关闭按钮自定义文本",
"type": "string"
},
{
"name": "show-icon",
"description": "是否显示图标",
"type": "boolean",
"default": "false"
},
{
"name": "effect",
"description": "选择提供的主题",
"type": "string",
"enum": "light / dark",
"default": "light"
}
],
"slots": [
{
"name": "default",
"description": "描述"
},
{
"name": "title",
"description": "标题的内容"
}
],
"js": {
"events": [
{
"name": "close",
"description": "关闭 `Alert` 时触发的事件"
}
]
}
},
{
"name": "ElAutocomplete",
"description": "根据输入内容提供对应的输入建议。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|placeholder|输入框占位文本|string|—|—|\n|clearable|是否可清空|boolean|—|false|\n|disabled|禁用|boolean|—|false|\n|readonly|原生属性,是否只读|boolean|—|false|\n|size|输入框尺寸,继承全局尺寸或者表单尺寸|string|`medium` / `small` / `mini`|—|\n|value-key|输入建议对象中用于显示的键名|string|—|value|\n|value / v-model|必填值,输入绑定值|string|—|—|\n|debounce|获取输入建议的去抖延时|number|—|300|\n|placement|下拉框出现的位置|string|`top` / `top-start` / `top-end` / `bottom` / `bottom-start` / `bottom-end` / `left` / `left-start` / `left-end` / `right` / `right-start` / `right-end`|bottom-start|\n|fetch-suggestions|返回输入建议的方法,仅当你的输入建议数据 `resolve` 时,通过调用 `callback(data:[])` 来返回它|function(queryString, callback)|—|—|\n|popper-class|`Autocomplete` 下拉列表的类名|string|—|—|\n|trigger-on-focus|是否在输入框 `focus` 时显示建议列表|boolean|—|true|\n|name|原生属性|string|—|—|\n|select-when-unmatched|在输入没有任何匹配建议的情况下,按下回车是否触发 `select` 事件|boolean|—|false|\n|label|输入框关联的 `label` 文字|string|—|—|\n|prefix-icon|输入框头部图标|string|—|—|\n|suffix-icon|输入框尾部图标|string|—|—|\n|hide-loading|是否隐藏远程加载时的加载图标|boolean|—|false|\n|popper-append-to-body|是否将下拉列表插入至 `body` 元素,在下拉列表的定位出现问题时,可将该属性设置为 `false`|boolean|—|true|\n|highlight-first-item|是否默认突出显示远程搜索建议中的第一项|boolean|—|false|\n|select-on-tab|通过 `tab` 键选择|boolean|—|false|\n|visible-arrow|是否显示 `Tooltip` 箭头|boolean|—|false|\n",
"events-table": "|事件名称|说明|回调参数|\n|:---|:---|:---|\n|blur|在 `Input` 失去焦点时触发|(event: Event)|\n|focus|在 `Input` 获得焦点时触发|(event: Event)|\n|select|点击选中建议项时触发|选中建议项|\n|change|在 `Input` 值改变时触发|(value: string / number)|\n|clear|在点击由 `clearable` 属性生成的清空按钮时触发|清空前的值|\n|visible-change|下拉框出现 / 隐藏时触发|出现则为 true,隐藏则为 false|\n",
"methods-table": "|方法名|说明|参数|\n|:---|:---|:---|\n|focus|使 `Input` 获取焦点|—|\n|switchSuggestions|手动显示下拉框|—|\n",
"slots-table": "|名称|说明|\n|:---|:---|\n|prefix|输入框头部内容|\n|suffix|输入框尾部内容|\n|prepend|输入框前置内容|\n|append|输入框后置内容|\n",
"scoped-slots-table": "|名称|说明|\n|:---|:---|\n|default|自定义输入建议,参数为 `{ item }`|\n",
"doc-url": "https://ui.const.team/#/component/autocomplete",
"props": [
{
"name": "placeholder",
"description": "输入框占位文本",
"type": "string"
},
{
"name": "clearable",
"description": "是否可清空",
"type": "boolean",
"default": "false"
},
{
"name": "disabled",
"description": "禁用",
"type": "boolean",
"default": "false"
},
{
"name": "readonly",
"description": "原生属性,是否只读",
"type": "boolean",
"default": "false"
},
{
"name": "size",
"description": "输入框尺寸,继承全局尺寸或者表单尺寸",
"type": "string",
"enum": "medium / small / mini"
},
{
"name": "value-key",
"description": "输入建议对象中用于显示的键名",
"type": "string",
"default": "value"
},
{
"name": "value / v-model",
"description": "必填值,输入绑定值",
"type": "string"
},
{
"name": "debounce",
"description": "获取输入建议的去抖延时",
"type": "number",
"default": "300"
},
{
"name": "placement",
"description": "下拉框出现的位置",
"type": "string",
"enum": "top / top-start / top-end / bottom / bottom-start / bottom-end / left / left-start / left-end / right / right-start / right-end",
"default": "bottom-start"
},
{
"name": "fetch-suggestions",
"description": "返回输入建议的方法,仅当你的输入建议数据 `resolve` 时,通过调用 `callback(data:[])` 来返回它",
"type": "function"
},
{
"name": "popper-class",
"description": "`Autocomplete` 下拉列表的类名",
"type": "string"
},
{
"name": "trigger-on-focus",
"description": "是否在输入框 `focus` 时显示建议列表",
"type": "boolean",
"default": "true"
},
{
"name": "name",
"description": "原生属性",
"type": "string"
},
{
"name": "select-when-unmatched",
"description": "在输入没有任何匹配建议的情况下,按下回车是否触发 `select` 事件",
"type": "boolean",
"default": "false"
},
{
"name": "label",
"description": "输入框关联的 `label` 文字",
"type": "string"
},
{
"name": "prefix-icon",
"description": "输入框头部图标",
"type": "string"
},
{
"name": "suffix-icon",
"description": "输入框尾部图标",
"type": "string"
},
{
"name": "hide-loading",
"description": "是否隐藏远程加载时的加载图标",
"type": "boolean",
"default": "false"
},
{
"name": "popper-append-to-body",
"description": "是否将下拉列表插入至 `body` 元素,在下拉列表的定位出现问题时,可将该属性设置为 `false`",
"type": "boolean",
"default": "true"
},
{
"name": "highlight-first-item",
"description": "是否默认突出显示远程搜索建议中的第一项",
"type": "boolean",
"default": "false"
},
{
"name": "select-on-tab",
"description": "通过 `tab` 键选择",
"type": "boolean",
"default": "false"
},
{
"name": "visible-arrow",
"description": "是否显示 `Tooltip` 箭头",
"type": "boolean",
"default": "false"
}
],
"slots": [
{
"name": "prefix",
"description": "输入框头部内容"
},
{
"name": "suffix",
"description": "输入框尾部内容"
},
{
"name": "prepend",
"description": "输入框前置内容"
},
{
"name": "append",
"description": "输入框后置内容"
}
],
"scoped-slots": [
{
"name": "default",
"description": "自定义输入建议,参数为 `{ item }`"
}
],
"js": {
"events": [
{
"name": "blur",
"description": "在 `Input` 失去焦点时触发"
},
{
"name": "focus",
"description": "在 `Input` 获得焦点时触发"
},
{
"name": "select",
"description": "点击选中建议项时触发"
},
{
"name": "change",
"description": "在 `Input` 值改变时触发"
},
{
"name": "clear",
"description": "在点击由 `clearable` 属性生成的清空按钮时触发"
},
{
"name": "visible-change",
"description": "下拉框出现 / 隐藏时触发"
}
],
"methods": [
{
"name": "focus",
"description": "使 `Input` 获取焦点"
},
{
"name": "switchSuggestions",
"description": "手动显示下拉框"
}
]
}
},
{
"name": "ElAvatar",
"description": "用图标、图片或者字符的形式展示用户或事物信息。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|icon|设置头像的图标类型,参考 [Icon](https://ui.const.team/#/component/icon) 组件|string|—|—|\n|size|设置头像的大小|number / string|`number` / `medium` / `small` / `mini`|—|\n|shape|设置头像的形状|string|`circle` / `square`|circle|\n|src|图片头像的资源地址|string|—|—|\n|src-set|以逗号分隔的一个或多个字符串列表表明一系列用户代理使用的可能的图像|string|—|—|\n|alt|描述图像的替换文本|string|—|—|\n|fit|当展示类型为图片的时候,设置图片如何适应容器框|string|`fill` / `contain` / `cover` / `none` / `scale-down`|cover|\n",
"events-table": "|事件名|说明|回调参数|\n|:---|:---|:---|\n|error|图片类头像加载失败的回调, 返回 `false` 会关闭组件默认的 `fallback` 行为|(e: Event)|\n",
"methods-table": "",
"slots-table": "|名称|说明|\n|:---|:---|\n|default|自定义头像展示内容|\n",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/avatar",
"props": [
{
"name": "icon",
"description": "设置头像的图标类型,参考 [Icon](https://ui.const.team/#/component/icon) 组件",
"type": "string"
},
{
"name": "size",
"description": "设置头像的大小",
"type": "number / string",
"enum": "number / medium / small / mini"
},
{
"name": "shape",
"description": "设置头像的形状",
"type": "string",
"enum": "circle / square",
"default": "circle"
},
{
"name": "src",
"description": "图片头像的资源地址",
"type": "string"
},
{
"name": "src-set",
"description": "以逗号分隔的一个或多个字符串列表表明一系列用户代理使用的可能的图像",
"type": "string"
},
{
"name": "alt",
"description": "描述图像的替换文本",
"type": "string"
},
{
"name": "fit",
"description": "当展示类型为图片的时候,设置图片如何适应容器框",
"type": "string",
"enum": "fill / contain / cover / none / scale-down",
"default": "cover"
}
],
"slots": [
{
"name": "default",
"description": "自定义头像展示内容"
}
],
"js": {
"events": [
{
"name": "error",
"description": "图片类头像加载失败的回调,返回 `false` 会关闭组件默认的 `fallback` 行为"
}
]
}
},
{
"name": "ElBacktop",
"description": "返回页面顶部的操作按钮。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|target|触发滚动的对象|string|—|—|\n|visibility-height|滚动高度达到此参数值才出现|number|—|200|\n|right|控制其显示位置, 距离页面右边距|number|—|40|\n|bottom|控制其显示位置, 距离页面底部距离|number|—|40|\n|effect|默认提供的主题|string|`dark` / `light`|light|\n|square|是否为方形|boolean|—|false|\n",
"events-table": "|事件名|说明|回调参数|\n|:---|:---|:---|\n|click|点击按钮触发的事件|点击事件|\n",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/backtop",
"props": [
{
"name": "target",
"description": "触发滚动的对象",
"type": "string"
},
{
"name": "visibility-height",
"description": "滚动高度达到此参数值才出现",
"type": "number",
"default": "200"
},
{
"name": "right",
"description": "控制其显示位置, 距离页面右边距",
"type": "number",
"default": "40"
},
{
"name": "bottom",
"description": "控制其显示位置, 距离页面底部距离",
"type": "number",
"default": "40"
},
{
"name": "effect",
"description": "默认提供的主题",
"type": "string",
"enum": "dark / light",
"default": "light"
},
{
"name": "square",
"description": "是否为方形",
"type": "boolean",
"default": "false"
}
],
"js": {
"events": [
{
"name": "click",
"description": "点击按钮触发的事件"
}
]
}
},
{
"name": "ElBadge",
"description": "出现在按钮、图标旁的数字或状态标记。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|value|显示值|string / number|—|—|\n|max|最大值,超过最大值会显示 `{max}+`,要求 `value` 是 `Number` 类型|number|—|—|\n|is-dot|小圆点|boolean|—|false|\n|hidden|隐藏 `Badge`|boolean|—|false|\n|type|类型|string|`primary` / `success` / `warning` / `danger` / `info`|—|\n|show-zero|值为零时是否显示 `Badge`|boolean|—|true|\n|background-color|背景色|string|—|—|\n|offset|`Badge` 的偏移量,格式是`[左,上]`, 代表状态点从左侧和默认位置顶部的偏移|array|—|—|\n|badge-style|自定义 `Badge` 样式,如果样式复杂建议使用 `badge-class`|object|—|—|\n|badge-class|自定义 `Badge` 类名|string|—|—|\n",
"events-table": "",
"methods-table": "",
"slots-table": "|名称|说明|\n|:---|:---|\n|default|自定义默认内容|\n",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/badge",
"props": [
{
"name": "value",
"description": "显示值",
"type": "string / number"
},
{
"name": "max",
"description": "最大值,超过最大值会显示 `{max}+`,要求 `value` 是 `Number` 类型",
"type": "number"
},
{
"name": "is-dot",
"description": "小圆点",
"type": "boolean",
"default": "false"
},
{
"name": "hidden",
"description": "隐藏 `Badge`",
"type": "boolean",
"default": "false"
},
{
"name": "type",
"description": "类型",
"type": "string",
"enum": "primary / success / warning / danger / info"
},
{
"name": "show-zero",
"description": "值为零时是否显示 `Badge`",
"type": "boolean",
"default": "true"
},
{
"name": "background-color",
"description": "背景色",
"type": "string"
},
{
"name": "offset",
"description": "`Badge` 的偏移量,格式是`[左,上]`代表状态点从左侧和默认位置顶部的偏移",
"type": "array"
},
{
"name": "badge-style",
"description": "自定义 `Badge` 样式,如果样式复杂建议使用 `badge-class`",
"type": "object"
},
{
"name": "badge-class",
"description": "自定义 `Badge` 类名",
"type": "string"
}
],
"slots": [
{
"name": "default",
"description": "自定义默认内容"
}
]
},
{
"name": "ElBreadcrumb",
"description": "显示当前页面的路径,快速返回之前的任意页面。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|separator|分隔符|string|—|'/'|\n|size|尺寸,继承全局尺寸|string|`medium` / `small` / `mini`|—|\n|separator-class|图标分隔符 `class`|string|—|—|\n",
"events-table": "",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/breadcrumb",
"subtags": ["ElBreadcrumbItem"],
"props": [
{
"name": "separator",
"description": "分隔符",
"type": "string",
"default": "/"
},
{
"name": "size",
"description": "尺寸,继承全局尺寸",
"type": "string",
"enum": "medium / small / mini"
},
{
"name": "separator-class",
"description": "图标分隔符 `class`",
"type": "string"
}
]
},
{
"name": "ElBreadcrumbItem",
"description": "面包屑组件的子集。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|title|标题,此属性优先级高于插槽|string|—|—|\n|to|路由跳转对象,同 `vue-router` 的 `to`|string / object|—|—|\n|replace|在使用 `to` 进行路由跳转时,启用 `replace` 将不会向 `history` 添加新记录|boolean|—|false|\n",
"events-table": "",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/breadcrumb#breadcrumbitem-attributes",
"props": [
{
"name": "title",
"description": "标题,此属性优先级高于插槽",
"type": "string"
},
{
"name": "to",
"description": "路由跳转对象,同 `vue-router` 的 `to`",
"type": "string / object"
},
{
"name": "replace",
"description": "在使用 `to` 进行路由跳转时,启用 `replace` 将不会向 `history` 添加新记录",
"type": "boolean",
"default": "false"
}
],
"slots": [
{
"name": "default",
"description": "自定义默认内容"
}
]
},
{
"name": "ElButton",
"description": "常用的操作按钮。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|size|尺寸|string|`medium` / `small` / `mini`|—|\n|type|类型|string|`primary` / `success` / `warning` / `danger` / `info` / `text`|—|\n|plain|是否朴素按钮|boolean|—|false|\n|round|是否圆角按钮|boolean|—|false|\n|circle|是否圆形按钮|boolean|—|false|\n|dashed|是否虚线按钮|boolean|—|false|\n|square|是否方形按钮|boolean|—|false|\n|loading|是否加载中状态|boolean|—|false|\n|disabled|是否禁用状态|boolean|—|false|\n|icon|图标类名|string|—|—|\n|icon-right|图标类名,显示在文字右侧|string|—|—|\n|autofocus|是否默认聚焦|boolean|—|false|\n|native-type|原生 `type` 属性|string|`button` / `submit` / `reset`|button|\n",
"events-table": "",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/button",
"props": [
{
"name": "size",
"description": "尺寸",
"type": "string",
"enum": "medium / small / mini"
},
{
"name": "type",
"description": "类型",
"type": "string",
"enum": "primary / success / warning / danger / info / text"
},
{
"name": "plain",
"description": "是否朴素按钮",
"type": "boolean",
"default": "false"
},
{
"name": "round",
"description": "是否圆角按钮",
"type": "boolean",
"default": "false"
},
{
"name": "circle",
"description": "是否圆形按钮",
"type": "boolean",
"default": "false"
},
{
"name": "dashed",
"description": "是否虚线按钮",
"type": "boolean",
"default": "false"
},
{
"name": "square",
"description": "是否方形按钮",
"type": "boolean",
"default": "false"
},
{
"name": "loading",
"description": "是否加载中状态",
"type": "boolean",
"default": "false"
},
{
"name": "disabled",
"description": "是否禁用状态",
"type": "boolean",
"default": "false"
},
{
"name": "icon",
"description": "图标类名",
"type": "string"
},
{
"name": "icon-right",
"description": "图标类名,显示在文字右侧",
"type": "string"
},
{
"name": "autofocus",
"description": "是否默认聚焦",
"type": "boolean",
"default": "false"
},
{
"name": "native-type",
"description": "原生 `type` 属性",
"type": "string",
"enum": "button / submit / reset",
"default": "button"
}
],
"slots": [
{
"name": "default",
"description": "自定义默认内容"
}
]
},
{
"name": "ElButtonGroup",
"description": "显示为按钮组,可用于对一系列类似操作进行分组。",
"props-table": "",
"events-table": "",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/button",
"subtags": ["ElButton"]
},
{
"name": "ElCalendar",
"description": "显示日期。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|value / v-model|绑定值|date / string / number|—|—|\n|range|时间范围,包括开始时间与结束时间,开始时间必须是周一,结束时间必须是周日,且时间跨度不能超过两个月|array|—|—|\n|first-day-of-week|周起始日|number|`1` / `2` / `3` / `4` / `5` / `6` / `7`|1|\n",
"events-table": "",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "|名称|说明|\n|:---|:---|\n|date-cell|单元格插槽,[参数如下](https://ui.const.team/#/component/calendar#datecell-parameters)|\n|header|日历面板标题内容,[参数如下](https://ui.const.team/#/component/calendar#header-parameters)|\n",
"doc-url": "https://ui.const.team/#/component/calendar",
"props": [
{
"name": "value / v-model",
"description": "绑定值",
"type": "date / string / number"
},
{
"name": "range",
"description": "时间范围,包括开始时间与结束时间,开始时间必须是周一,结束时间必须是周日,且时间跨度不能超过两个月",
"type": "array"
},
{
"name": "first-day-of-week",
"description": "周起始日",
"type": "number",
"enum": "1 / 2 / 3 / 4 / 5 / 6 / 7",
"default": "1"
}
],
"slots": [
{
"name": "date-cell",
"description": "单元格插槽,[参数如下](https://ui.const.team/#/component/calendar#datecell-parameters)"
},
{
"name": "header",
"description": "日历面板标题内容,[参数如下](https://ui.const.team/#/component/calendar#header-parameters)"
}
]
},
{
"name": "ElCard",
"description": "将信息聚合在卡片容器中展示。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|header|设置 `header`,也可以通过 `slot#header` 传入 `DOM`|string|—|—|\n|footer|设置 `footer`,也可以通过 `slot#footer` 传入 `DOM`|string|—|—|\n|body-style|设置 `body` 的样式|object|—|{ padding: '20px' }|\n|shadow|设置阴影显示时机|string|`always` / `hover` / `never`|always|\n",
"events-table": "",
"methods-table": "",
"slots-table": "|名称|说明|\n|:---|:---|\n|default|自定义默认内容|\n|header|卡片标题内容|\n|footer|卡片页脚内容|\n",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/card",
"props": [
{
"name": "header",
"description": "设置 `header`,也可以通过 `slot#header` 传入 `DOM`",
"type": "string"
},
{
"name": "footer",
"description": "设置 `footer`,也可以通过 `slot#footer` 传入 `DOM`",
"type": "string"
},
{
"name": "body-style",
"description": "设置 `body` 的样式",
"type": "object",
"default": "{ padding: '20px' }"
},
{
"name": "shadow",
"description": "设置阴影显示时机",
"type": "string",
"enum": "always / hover / never",
"default": "always"
}
],
"slots": [
{
"name": "default",
"description": "自定义默认内容"
},
{
"name": "header",
"description": "卡片标题内容"
},
{
"name": "footer",
"description": "卡片页脚内容"
}
]
},
{
"name": "ElCarousel",
"description": "在有限空间内,循环播放同一类型的图片、文字等内容。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|width|走马灯的宽度|string|—|—|\n|height|走马灯的高度|string|—|—|\n|initial-index|初始状态激活的幻灯片的索引,从 0 开始|number|—|0|\n|trigger|指示器的触发方式|string|`click` / `hover`|hover|\n|autoplay|是否自动切换|boolean|—|true|\n|interval|自动切换的时间间隔,单位为毫秒|number|—|3000|\n|indicator-position|指示器的位置|string|`outside` / `none`|—|\n|arrow|切换箭头的显示时机|string|`always` / `hover` / `never`|hover|\n|type|走马灯的类型|string|`card`|—|\n|loop|是否循环显示|boolean|—|true|\n|direction|走马灯展示的方向|string|`horizontal` / `vertical`|horizontal|\n",
"events-table": "|事件名称|说明|回调参数|\n|:---|:---|:---|\n|change|幻灯片切换时触发|目前激活的幻灯片的索引,原幻灯片的索引|\n",
"methods-table": "|方法名|说明|参数|\n|:---|:---|:---|\n|setActiveItem|手动切换幻灯片|需要切换的幻灯片的索引,从 0 开始;或相应 `el-carousel-item` 的 `name` 属性值|\n|prev|切换至上一张幻灯片|—|\n|next|切换至下一张幻灯片|—|\n",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/carousel",
"subtags": ["ElCarouselItem"],
"props": [
{
"name": "width",
"description": "走马灯的宽度",
"type": "string"
},
{
"name": "height",
"description": "走马灯的高度",
"type": "string"
},
{
"name": "initial-index",
"description": "初始状态激活的幻灯片的索引,从 `0` 开始",
"type": "number",
"default": "0"
},
{
"name": "trigger",
"description": "指示器的触发方式",
"type": "string",
"enum": "click"
},
{
"name": "autoplay",
"description": "是否自动切换",
"type": "boolean",
"default": "true"
},
{
"name": "interval",
"description": "自动切换的时间间隔,单位为毫秒",
"type": "number",
"default": "3000"
},
{
"name": "indicator-position",
"description": "指示器的位置",
"type": "string",
"enum": "outside / none"
},
{
"name": "arrow",
"description": "切换箭头的显示时机",
"type": "string",
"enum": "always / hover / never",
"default": "hover"
},
{
"name": "type",
"description": "走马灯的类型",
"type": "string",
"enum": "card"
},
{
"name": "loop",
"description": "是否循环显示",
"type": "boolean",
"default": "true"
},
{
"name": "direction",
"description": "走马灯展示的方向",
"type": "string",
"enum": "horizontal / vertical",
"default": "horizontal"
}
],
"js": {
"events": [
{
"name": "change",
"description": "幻灯片切换时触发"
}
],
"methods": [
{
"name": "setActiveItem",
"description": "手动切换幻灯片"
},
{
"name": "prev",
"description": "切换至上一张幻灯片"
},
{
"name": "next",
"description": "切换至下一张幻灯片"
}
]
}
},
{
"name": "ElCarouselItem",
"description": "走马灯组件的子集。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|name|幻灯片的名字,可用作 `setActiveItem` 的参数|string|—|—|\n|label|该幻灯片所对应指示器的文本|string|—|—|\n|lazy|是否懒加载|boolean|—|false|\n",
"events-table": "",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/carousel#carouselitem-attributes",
"props": [
{
"name": "name",
"description": "幻灯片的名字,可用作 `setActiveItem` 的参数",
"type": "string"
},
{
"name": "label",
"description": "该幻灯片所对应指示器的文本",
"type": "string"
},
{
"name": "lazy",
"description": "是否懒加载",
"type": "boolean",
"default": "false"
}
]
},
{
"name": "ElCascader",
"description": "当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|value / v-model|选中项绑定值|string / number / object|—|—|\n|options|可选项数据源,键名可通过 `Props` 属性配置|array|—|—|\n|props|配置选项,具体见 [Props配置](https://ui.const.team/#/component/cascader#props)|object|—|—|\n|size|尺寸,继承全局尺寸或者表单尺寸|string|`medium` / `small` / `mini`|—|\n|placeholder|输入框占位文本|string|—|请选择|\n|placement|下拉框出现的位置|string|`top` / `top-start` / `top-end` / `bottom` / `bottom-start` / `bottom-end` / `left` / `left-start` / `left-end` / `right` / `right-start` / `right-end`|bottom-start|\n|disabled|是否禁用|boolean|—|false|\n|clearable|是否支持清空选项|boolean|—|false|\n|show-all-levels|输入框中是否显示选中值的完整路径|boolean|—|true|\n|collapse-tags|多选模式下是否折叠 `Tag`|boolean|—|false|\n|collapse-tags-max-num|多选模式下设置多少后开始折叠|number|—|1|\n|separator|选项分隔符|string|—|'/'|\n|filterable|是否可搜索选项|boolean|—|—|\n|filter-method|自定义搜索逻辑,第一个参数是节点 `node`,第二个参数是搜索关键词 `keyword`,通过返回布尔值表示是否命中|function(node, keyword)|—|—|\n|debounce|搜索关键词输入的去抖延迟,单位为毫秒|number|—|300|\n|before-filter|筛选之前的钩子,参数为输入的值,若返回 `false` 或者返回 `Promise` 且被 `reject`,则停止筛选|function(value)|—|—|\n|popper-class|自定义浮层类名|string|—|—|\n|option-max-width|选项框最大宽度,默认不限制|string / number|—|—|\n|popper-max-width|折叠下拉最大宽度|string / number|—|300|\n|popper-append-to-body|是否将弹出框插入至 `body` 元素,在弹出框的定位出现问题时,可将该属性设置为 `false`|boolean|—|true|\n|visible-arrow|是否显示 `Tooltip` 箭头|boolean|—|false|\n|overlay|搜索框是否显示在下拉菜单中|boolean|—|false|\n|tag-type|标签类型|string|`success` / `info` / `warning` / `danger`|info|\n",
"events-table": "|事件名称|说明|回调参数|\n|:---|:---|:---|\n|change|当选中节点变化时触发|选中节点的值|\n|expand-change|当展开节点发生变化时触发|各父级选项值组成的数组|\n|blur|当失去焦点时触发|(event: Event)|\n|focus|当获得焦点时触发|(event: Event)|\n|visible-change|下拉框出现/隐藏时触发|出现则为 true,隐藏则为 false|\n|remove-tag|在多选模式下,移除 `Tag` 时触发|移除的 Tag 对应的节点的值|\n|clear|在点击由 `clearable` 属性生成的清空按钮时触发|清空前的值|\n|select-node|在点击 `checkbox` 或者 `radio` 时返回当前点击节点的 node 节点|node|\n",
"methods-table": "|方法名|说明|参数|\n|:---|:---|:---|\n|getCheckedNodes|获取选中的节点|(leafOnly) 是否只是叶子节点,默认值为 `false`|\n",
"slots-table": "|名称|说明|\n|:---|:---|\n|empty|无选项时的列表|\n|search-empty|无匹配选项时的内容|\n|header|级联框顶部扩展内容|\n|extend|级联框底部扩展内容|\n",
"scoped-slots-table": "|名称|说明|\n|:---|:---|\n|default|自定义备选项的节点内容,参数为 `{ node, data }`,分别为当前节点的 Node 对象和数据|\n|search-node|自定义搜索节点内容,参数为 `{ node, data }`,分别为当前节点的 Node 对象和数据|\n|tag|自定义 `tag` 标签内容|\n",
"doc-url": "https://ui.const.team/#/component/cascader",
"props": [
{
"name": "value / v-model",
"description": "选中项绑定值",
"type": "string / number / object"
},
{
"name": "options",
"description": "可选项数据源,键名可通过 `Props` 属性配置",
"type": "array"
},
{
"name": "props",
"description": "配置选项,具体见[Props](https://ui.const.team/#/component/cascader#props)",
"type": "object"
},
{
"name": "size",
"description": "尺寸,继承全局尺寸或者表单尺寸",
"type": "string",
"enum": "medium / small / mini"
},
{
"name": "placeholder",
"description": "输入框占位文本",
"type": "string",
"default": "请选择"
},
{
"name": "placement",
"description": "下拉框出现的位置",
"type": "string",
"enum": "top / top-start / top-end / bottom / bottom-start / bottom-end / left / left-start / left-end / right / right-start / right-end",
"default": "bottom-start"
},
{
"name": "disabled",
"description": "是否禁用",
"type": "boolean",
"default": "false"
},
{
"name": "clearable",
"description": "是否支持清空选项",
"type": "boolean",
"default": "false"
},
{
"name": "show-all-levels",
"description": "输入框中是否显示选中值的完整路径",
"type": "boolean",
"default": "true"
},
{
"name": "collapse-tags",
"description": "多选模式下是否折叠 `Tag`",
"type": "boolean",
"default": "false"
},
{
"name": "collapse-tags-max-num",
"description": "多选模式下设置多少后开始折叠",
"type": "number",
"default": "1"
},
{
"name": "separator",
"description": "选项分隔符",
"type": "string",
"default": "/"
},
{
"name": "filterable",
"description": "是否可搜索选项",
"type": "boolean"
},
{
"name": "filter-method",
"description": "自定义搜索逻辑,第一个参数是节点 `node`,第二个参数是搜索关键词 `keyword`,通过返回布尔值表示是否命中",
"type": "function"
},
{
"name": "debounce",
"description": "搜索关键词输入的去抖延迟,单位毫秒",
"type": "number",
"default": "300"
},
{
"name": "before-filter",
"description": "筛选之前的钩子,参数为输入的值,若返回 `false` 或者返回 `Promise` 且被 `reject`,则停止筛选",
"type": "function"
},
{
"name": "popper-class",
"description": "自定义浮层类名",
"type": "string"
},
{
"name": "option-max-width",
"description": "选项框最大宽度,默认不限制",
"type": "string / number"
},
{
"name": "popper-max-width",
"description": "折叠下拉最大宽度",
"type": "string / number",
"default": "300"
},
{
"name": "popper-append-to-body",
"description": "是否将弹出框插入至 `body` 元素,在弹出框的定位出现问题时,可将该属性设置为 `false`",
"type": "boolean",
"default": "true"
},
{
"name": "visible-arrow",
"description": "是否显示 `Tooltip` 箭头",
"type": "boolean",
"default": "false"
},
{
"name": "overlay",
"description": "搜索框是否显示在下拉菜单中",
"type": "boolean",
"default": "false"
},
{
"name": "tag-type",
"description": "标签类型",
"type": "string",
"enum": "success / info / warning / danger",
"default": "info"
}
],
"js": {
"events": [
{
"name": "change",
"description": "当选中节点变化时触发"
},
{
"name": "expand-change",
"description": "当展开节点发生变化时触发"
},
{
"name": "blur",
"description": "当失去焦点时触发"
},
{
"name": "focus",
"description": "当获得焦点时触发"
},
{
"name": "visible-change",
"description": "下拉框出现/隐藏时触发"
},
{
"name": "remove-tag",
"description": "在多选模式下,移除 `Tag` 时触发"
},
{
"name": "clear",
"description": "在点击由 `clearable` 属性生成的清空按钮时触发"
},
{
"name": "select-node",
"description": "在点击 `checkbox` 或者 `radio` 时返回当前点击节点的 `node` 节点"
}
],
"methods": [
{
"name": "getCheckedNodes",
"description": "获取选中的节点"
}
]
},
"slots": [
{
"name": "default",
"description": "自定展示内容"
},
{
"name": "empty",
"description": "无选项时的列表"
},
{
"name": "search-empty",
"description": "无匹配选项时的内容"
},
{
"name": "header",
"description": "级联框顶部扩展内容"
},
{
"name": "extend",
"description": "级联框底部扩展内容"
}
],
"scoped-slots": [
{
"name": "default",
"description": "自定义备选项的节点内容,参数为 `{ node, data }`,分别为当前节点的 `Node` 对象和数据"
},
{
"name": "search-node",
"description": "自定义搜索节点内容,参数为 `{ node, data }`,分别为当前节点的 `Node` 对象和数据"
},
{
"name": "tag",
"description": "自定义 `tag` 标签内容"
}
]
},
{
"name": "ElCascaderPanel",
"description": "级联面板,可独立使用,不依赖于 Cascader 组件。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|value / v-model|选中项绑定值|string / number / object|—|—|\n|options|可选项数据源,键名可通过 `Props` 属性配置|array|—|—|\n|props|配置选项,具体见 [Props配置](https://ui.const.team/#/component/cascader#props)|object|—|—|\n|size|尺寸|string|`medium` / `small` / `mini`|—|\n",
"events-table": "|事件名称|说明|回调参数|\n|:---|:---|:---|\n|change|当选中节点变化时触发|选中节点的值|\n|expand-change|当展开节点发生变化时触发|各父级选项值组成的数组|\n",
"methods-table": "|方法名|说明|参数|\n|:---|:---|:---|\n|getCheckedNodes|获取选中的节点数组|(leafOnly) 是否只是叶子节点,默认值为 `false`|\n|clearCheckedNodes|清空选中的节点|—|\n",
"slots-table": "",
"scoped-slots-table": "|名称|说明|\n|:---|:---|\n|default|自定义备选项的节点内容,参数为 `{ node, data }`,分别为当前节点的 Node 对象和数据|\n",
"doc-url": "https://ui.const.team/#/component/cascader#cascaderpanel-attributes",
"props": [
{
"name": "value / v-model",
"description": "选中项绑定值",
"type": "string / array"
},
{
"name": "options",
"description": "可选项数据源,键名可通过 `Props` 属性配置",
"type": "array"
},
{
"name": "props",
"description": "配置选项,具体见[Props](https://ui.const.team/#/component/cascader#props)",
"type": "object"
},
{
"name": "size",
"description": "尺寸",
"type": "string",
"enum": "medium / small / mini"
}
],
"js": {
"events": [
{
"name": "change",
"description": "当选中节点变化时触发"
},
{
"name": "expand-change",
"description": "当展开节点发生变化时触发"
}
],
"methods": [
{
"name": "getCheckedNodes",
"description": "获取选中的节点"
},
{
"name": "clearCheckedNodes",
"description": "清空选中的节点"
}
]
},
"scoped-slots": [
{
"name": "default",
"description": "自定义备选项的节点内容,参数为 `{ node, data }`,分别为当前节点的 `Node` 对象和数据"
}
]
},
{
"name": "ElCheckbox",
"description": "一组备选项中进行多选。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|value / v-model|绑定值|string / number / boolean|—|—|\n|label|选中状态的值(只有在 `checkbox-group` 或者绑定对象类型为 `Array` 时有效)|string / number / boolean|—|—|\n|true-label|选中时的值|string / number|—|—|\n|false-label|没有选中时的值|string / number|—|—|\n|disabled|是否禁用|boolean|—|false|\n|border|是否显示边框|boolean|—|false|\n|size|`Checkbox` 的尺寸,继承全局尺寸或者表单尺寸|string|`medium` / `small` / `mini`|—|\n|name|原生 `name` 属性|string|—|—|\n|checked|当前是否勾选|boolean|—|false|\n|indeterminate|设置 `indeterminate` 状态,只负责样式控制|boolean|—|false|\n",
"events-table": "|事件名称|说明|回调参数|\n|:---|:---|:---|\n|change|当绑定值变化时触发的事件|更新后的值|\n",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/checkbox",
"props": [
{
"name": "value / v-model",
"description": "绑定值",
"type": "string / number / boolean"
},
{
"name": "label",
"description": "选中状态的值(只有在 `checkbox-group` 或者绑定对象类型为 `Array` 时有效)",
"type": "string / number / boolean"
},
{
"name": "true-label",
"description": "选中时的值",
"type": "string / number"
},
{
"name": "false-label",
"description": "没有选中时的值",
"type": "string / number"
},
{
"name": "disabled",
"description": "是否禁用",
"type": "boolean",
"default": "false"
},
{
"name": "border",
"description": "是否显示边框",
"type": "boolean",
"default": "false"
},
{
"name": "size",
"description": "`Checkbox` 的尺寸,继承全局尺寸或者表单尺寸",
"type": "string",
"enum": "medium / small / mini"
},
{
"name": "name",
"description": "原生 `name` 属性",
"type": "string"
},
{
"name": "checked",
"description": "当前是否勾选",
"type": "boolean",
"default": "false"
},
{
"name": "indeterminate",
"description": "设置 `indeterminate` 状态,只负责样式控制",
"type": "boolean",
"default": "false"
}
],
"js": {
"events": [
{
"name": "change",
"description": "当绑定值变化时触发的事件"
}
]
}
},
{
"name": "ElCheckboxButton",
"description": "复选框以按钮形式展示。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|label|选中状态的值(只有在 `checkbox-group` 或者绑定对象类型为 `Array` 时有效)|string / number / boolean|—|—|\n|true-label|选中时的值|string / number|—|—|\n|false-label|没有选中时的值|string / number|—|—|\n|disabled|是否禁用|boolean|—|false|\n|name|原生 `name` 属性|string|—|—|\n|checked|当前是否勾选|boolean|—|false|\n",
"events-table": "",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/checkbox#checkboxbutton-attributes",
"props": [
{
"name": "label",
"description": "选中状态的值(只有在 `checkbox-group` 或者绑定对象类型为 `Array` 时有效)",
"type": "string / number / boolean"
},
{
"name": "true-label",
"description": "选中时的值",
"type": "string / number"
},
{
"name": "false-label",
"description": "没有选中时的值",
"type": "string / number"
},
{
"name": "disabled",
"description": "是否禁用",
"type": "boolean",
"default": "false"
},
{
"name": "name",
"description": "原生 `name` 属性",
"type": "string"
},
{
"name": "checked",
"description": "当前是否勾选",
"type": "boolean",
"default": "false"
}
]
},
{
"name": "ElCheckboxTag",
"description": "复选框以标签形式展示。",
"props-table": "|参数|说明|类型|可选值|默认值|\n|:---|:---|:---|:---|:---|\n|label|选中状态的值(只有在 `checkbox-group` 或者绑定对象类型为 `Array` 时有效)|string / number / boolean|—|—|\n|true-label|选中时的值|string / number|—|—|\n|false-label|没有选中时的值|string / number|—|—|\n|disabled|是否禁用|boolean|—|false|\n|name|原生 `name` 属性|string|—|—|\n|icon|图标类名|string|—|—|\n|type|类型|string|`primary` / `success` / `warning` / `danger` / `info`|primary|\n|checked|当前是否勾选|boolean|—|false|\n",
"events-table": "",
"methods-table": "",
"slots-table": "",
"scoped-slots-table": "",
"doc-url": "https://ui.const.team/#/component/checkbox#checkboxtag-attributes",
"props": [
{
"name": "label",
"description": "选中状态的值(只有在 `checkbox-group` 或者绑定对象类型为 `Array` 时有效)",
"type": "string / number / boolean"
},
{
"name": "true-label",
"description": "选中时的值",
"type": "string / number"
},
{
"name": "false-label",
"description": "没有选中时的值",