cloud-ui.vusion
Version:
Vusion Cloud UI
1,126 lines (1,125 loc) • 1.33 MB
JSON
[
{
"symbol": "u-linear-layout",
"name": "线性布局",
"icon": "linear-layout",
"depDescription": {},
"description": "内部元素按照一定的规则布局",
"labels": [
"Layout"
],
"screenShot": "https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-linear-layout.vue/screenshots/0.png,https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-linear-layout.vue/screenshots/1.png,https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-linear-layout.vue/screenshots/2.png",
"blocks": "[{\"title\":\"单行排布\",\"description\":\"\",\"code\":\"<template>\\n<u-linear-layout direction=\\\"horizontal\\\">\\n</u-linear-layout>\\n</template>\\n\"},{\"title\":\"多行排布\",\"description\":\"\",\"code\":\"<template>\\n<u-linear-layout direction=\\\"vertical\\\">\\n <u-linear-layout>\\n </u-linear-layout>\\n <u-linear-layout>\\n </u-linear-layout>\\n</u-linear-layout>\\n</template>\\n\"},{\"title\":\"两端排布\",\"description\":\"\",\"code\":\"<template>\\n<u-linear-layout justify=\\\"space-between\\\">\\n <u-linear-layout>\\n </u-linear-layout>\\n <u-linear-layout>\\n </u-linear-layout>\\n</u-linear-layout>\\n</template>\\n\"}]",
"jsonSchema": {
"name": "u-linear-layout",
"title": "线性布局",
"description": "内部元素按照一定的规则布局",
"category": "Layout",
"screenShot": "https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-linear-layout.vue/screenshots/0.png,https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-linear-layout.vue/screenshots/1.png,https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-linear-layout.vue/screenshots/2.png",
"drawings": "https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-linear-layout.vue/drawings/0.svg,https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-linear-layout.vue/drawings/1.svg,https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-linear-layout.vue/drawings/2.svg",
"blocks": [
{
"title": "单行排布",
"description": "",
"code": "<template>\n<u-linear-layout direction=\"horizontal\">\n</u-linear-layout>\n</template>\n"
},
{
"title": "多行排布",
"description": "",
"code": "<template>\n<u-linear-layout direction=\"vertical\">\n <u-linear-layout>\n </u-linear-layout>\n <u-linear-layout>\n </u-linear-layout>\n</u-linear-layout>\n</template>\n"
},
{
"title": "两端排布",
"description": "",
"code": "<template>\n<u-linear-layout justify=\"space-between\">\n <u-linear-layout>\n </u-linear-layout>\n <u-linear-layout>\n </u-linear-layout>\n</u-linear-layout>\n</template>\n"
}
],
"attrs": [
{
"name": "display",
"title": "展示方式",
"type": "string",
"options": [
{
"value": "inline",
"title": "行内"
},
{
"value": "block",
"title": "块级"
}
],
"default": "block",
"description": "行内展示,或块级换行展示",
"advanced": true
},
{
"name": "type",
"title": "布局模式",
"type": "string",
"options": [
{
"value": "flex",
"title": "flex 布局模式"
}
],
"description": "布局模式",
"advanced": true
},
{
"name": "mode",
"title": "布局模式",
"type": "string",
"display": "capsules",
"bindHide": true,
"description": "",
"tooltipLink": "http://help.lcap.163yun.com/1.%E5%BC%80%E5%8F%91%E5%BA%94%E7%94%A8/2.%E9%A1%B5%E9%9D%A2/05.PC%E9%A1%B5%E9%9D%A2%E5%9F%BA%E7%A1%80%E7%BB%84%E4%BB%B6/01.%E5%B8%83%E5%B1%80/020.%E7%BA%BF%E6%80%A7%E5%B8%83%E5%B1%80.html",
"options": [
{
"value": "inline",
"title": "行内",
"icon": "layout-inline-block",
"tooltip": "内联布局"
},
{
"value": "block",
"title": "块级",
"icon": "layout-block",
"tooltip": "块级布局"
},
{
"value": "flex",
"title": "弹性",
"icon": "layout-flex",
"tooltip": "弹性布局"
}
],
"default": "block",
"toggleclear": [
"justify",
"alignment",
"wrap",
"layout"
],
"group": "主要属性",
"brifeDoc": "",
"docDescription": "内联布局:将当前元素修改为内联布局模式,各个内联布局模式的元素将默认排布在同一行中,若空间不足以排布下一个内联布局元素,则该元素将会换行。\n块级布局:将当前元素修改为块级布局模式,各个块级布局模式的元素之前和之后均会换行。\n弹性布局:在弹性布局模式中,子元素可以在任何方向上排布,也可以“弹性伸缩”其尺寸,既可以增加尺寸以填满未使用的空间,也可以收缩尺寸以避免溢出父元素。"
},
{
"name": "direction",
"title": "主轴方向",
"type": "string",
"display": "capsules",
"bindHide": true,
"options": [
{
"value": "horizontal",
"title": "横向排列",
"icon": "flex-horizontal",
"tooltip": "横向"
},
{
"value": "vertical",
"title": "纵向排列",
"icon": "flex-vertical",
"tooltip": "纵向"
}
],
"default": "horizontal",
"toggleclear": [
"justify",
"alignment"
],
"group": "主要属性",
"description": "",
"brifeDoc": "",
"docDescription": "横向:内部子元素进行横向排布,建议内部子元素使用行内布局。\n纵向:内部子元素进行纵向排布,建议内部子元素使用块级布局。",
"tooltipLink": ""
},
{
"name": "justify",
"title": "横轴对齐",
"type": "string",
"display": "capsules",
"bindHide": true,
"options": [
{
"value": "start",
"title": "左对齐",
"icon": "horizontal-justify-start",
"tooltip": "左对齐"
},
{
"value": "center",
"title": "居中对齐",
"icon": "horizontal-justify-center",
"tooltip": "居中对齐"
},
{
"value": "end",
"title": "右对齐",
"icon": "horizontal-justify-end",
"tooltip": "右对齐"
},
{
"value": "space-between",
"title": "平均分布(两端不留空)",
"icon": "horizontal-justify-space-between",
"tooltip": "平均分布(两端不留空)",
"dependency": [
{
"direction": "horizontal"
},
{
"mode": "flex"
}
]
},
{
"value": "space-around",
"title": "平均分布",
"icon": "horizontal-justify-space-around",
"tooltip": "平均分布",
"dependency": [
{
"mode": "flex"
}
]
}
],
"default": "start",
"dependency": [
{
"direction": "horizontal"
},
{
"mode": "inline",
"direction": "horizontal"
},
{
"mode": "inline",
"direction": "vertical"
},
{
"mode": "block",
"direction": "horizontal"
},
{
"mode": "block",
"direction": "vertical"
}
],
"toggleupdate": [
{
"value": "space-between",
"updateData": {
"gap": "normal"
}
},
{
"value": "space-around",
"updateData": {
"gap": "normal"
}
}
],
"group": "主要属性",
"description": "",
"brifeDoc": "",
"docDescription": "主轴方向为横向时:支持左对齐、居中对齐、右对齐、平均分布(两端不留空)、平均分布,其中平均分布仅在弹性布局模式下展示。\n主轴方向为纵向时:支持左对齐、居中对齐、右对齐、占满容器宽度,其中占满容器宽度仅在弹性布局模式下展示。",
"tooltipLink": ""
},
{
"name": "alignment",
"title": "纵轴对齐",
"type": "string",
"display": "capsules",
"bindHide": true,
"options": [
{
"value": "start",
"title": "顶对齐",
"icon": "horizontal-alignment-start",
"tooltip": "顶对齐"
},
{
"value": "center",
"title": "垂直居中",
"icon": "horizontal-alignment-center",
"tooltip": "垂直居中"
},
{
"value": "end",
"title": "底对齐",
"icon": "horizontal-alignment-end",
"tooltip": "底对齐"
},
{
"value": "baseline",
"title": "行内文字基线对齐",
"icon": "horizontal-alignment-baseline",
"tooltip": "行内文字基线对齐"
},
{
"value": "stretch",
"title": "占满容器高度",
"icon": "horizontal-alignment-stretch",
"tooltip": "占满容器高度"
}
],
"default": "stretch",
"dependency": [
{
"mode": "flex",
"direction": "horizontal"
}
],
"group": "主要属性",
"description": "",
"brifeDoc": "",
"docDescription": "主轴方向为横向时:支持顶对齐、垂直居中、底对齐、行内文字基线对齐、占满容器高度。\n主轴方向为纵向时:支持顶对齐、垂直居中、底对齐、平均分布(两端不留空)、平均分布。",
"tooltipLink": ""
},
{
"name": "alignment",
"title": "纵轴对齐",
"type": "string",
"display": "capsules",
"bindHide": true,
"options": [
{
"value": "start",
"title": "左对齐",
"icon": "vertical-alignment-start",
"tooltip": "左对齐"
},
{
"value": "center",
"title": "居中对齐",
"icon": "vertical-alignment-center",
"tooltip": "居中对齐"
},
{
"value": "end",
"title": "右对齐",
"icon": "vertical-alignment-end",
"tooltip": "右对齐"
},
{
"value": "stretch",
"title": "拉伸子元素充满整个父元素空间",
"icon": "vertical-alignment-stretch",
"tooltip": "占满容器宽度"
}
],
"default": "stretch",
"dependency": [
{
"mode": "flex",
"direction": "vertical"
}
],
"group": "主要属性",
"description": "",
"brifeDoc": "",
"docDescription": "主轴方向为横向时:支持顶对齐、垂直居中、底对齐、行内文字基线对齐、占满容器高度。\n主轴方向为纵向时:支持顶对齐、垂直居中、底对齐、平均分布(两端不留空)、平均分布。",
"tooltipLink": ""
},
{
"name": "justify",
"title": "横轴对齐",
"type": "string",
"display": "capsules",
"bindHide": true,
"options": [
{
"value": "start",
"title": "顶对齐",
"icon": "vertical-justify-start",
"tooltip": "顶对齐"
},
{
"value": "center",
"title": "垂直居中",
"icon": "vertical-justify-center",
"tooltip": "垂直居中"
},
{
"value": "end",
"title": "底对齐",
"icon": "vertical-justify-end",
"tooltip": "底对齐"
},
{
"value": "space-between",
"title": "平均分布(两端不留空)",
"icon": "vertical-justify-space-between",
"tooltip": "平均分布(两端不留空)"
},
{
"value": "space-around",
"title": "平均分布",
"icon": "vertical-justify-space-around",
"tooltip": "平均分布"
}
],
"default": "start",
"dependency": [
{
"mode": "flex",
"direction": "vertical"
}
],
"toggleupdate": [
{
"value": "space-between",
"updateData": {
"gap": "normal"
}
},
{
"value": "space-around",
"updateData": {
"gap": "normal"
}
}
],
"group": "主要属性",
"description": "",
"brifeDoc": "",
"docDescription": "主轴方向为横向时:支持左对齐、居中对齐、右对齐、平均分布(两端不留空)、平均分布,其中平均分布仅在弹性布局模式下展示。\n主轴方向为纵向时:支持左对齐、居中对齐、右对齐、占满容器宽度,其中占满容器宽度仅在弹性布局模式下展示。",
"tooltipLink": ""
},
{
"name": "layout",
"title": "子元素展示方式",
"type": "string",
"options": [
{
"value": "none",
"title": "子元素默认布局"
},
{
"value": "inline",
"title": "子元素行内布局"
},
{
"value": "block",
"title": "子元素块级布局"
}
],
"default": "none",
"description": "子元素行内展示或块级换行展示",
"dependency": [
{
"mode": "inline"
},
{
"mode": "block"
}
],
"group": "主要属性",
"brifeDoc": "",
"docDescription": "布局内各个组件的布局方式,支持默认、行内和块级三种布局方式。",
"tooltipLink": ""
},
{
"name": "wrap",
"title": "换行",
"type": "boolean",
"default": true,
"description": "设置弹性布局下子元素总宽度超出父级时子元素是否换行展示",
"dependency": [
{
"mode": "flex"
}
],
"group": "主要属性",
"brifeDoc": "",
"docDescription": "支持控制弹性布局模式下,子元素总宽度超过父级时是否换行展示,默认开启。",
"tooltipLink": ""
},
{
"name": "loadingIcon",
"title": "加载中图标",
"type": "icon",
"default": "loading",
"description": "加载中状态显示的图标",
"group": "状态属性",
"brifeDoc": "",
"docDescription": "支持从图标库选择图标或上传自定义图标。",
"tooltipLink": ""
},
{
"name": "loadingIconRotate",
"title": "加载中图标旋转",
"type": "boolean",
"default": true,
"description": "设置加载中图标是否旋转,默认开启。",
"group": "状态属性",
"brifeDoc": "",
"docDescription": "支持控制加载中图标是否旋转,默认开启。",
"tooltipLink": ""
},
{
"name": "loadingText",
"title": "加载中文案",
"type": "string",
"default": "",
"description": "加载中状态显示的提示文案",
"group": "状态属性",
"brifeDoc": "",
"docDescription": "支持编辑组件加载中情况显示文案。",
"tooltipLink": ""
},
{
"name": "gap",
"title": "内容间隙",
"type": "string",
"options": [
{
"value": "shrink",
"title": "收缩",
"advanced": true
},
{
"value": "none",
"title": "无"
},
{
"value": "small",
"title": "小"
},
{
"value": "normal",
"title": "正常"
},
{
"value": "large",
"title": "大"
}
],
"default": "normal",
"description": "内容块间隙大小",
"dependency": [
{
"!justify": [
"space-between",
"space-around"
]
}
],
"group": "样式属性",
"brifeDoc": "",
"docDescription": "布局内各个组件之间的间隔,通常有收缩、无、小、正常、大,默认为正常。",
"tooltipLink": ""
}
],
"slots": [
{
"concept": "Slot",
"name": "default",
"description": "内容"
}
],
"methods": [
{
"name": "openLoading",
"title": "打开加载中",
"description": "打开加载中"
},
{
"name": "closeLoading",
"title": "关闭加载中",
"description": "关闭加载中"
}
],
"events": [
{
"name": "click",
"title": "点击",
"description": "在元素上按下并释放任意鼠标按钮时触发。"
},
{
"name": "dblclick",
"title": "双击",
"description": "在元素上双击鼠标按钮时触发。"
},
{
"name": "contextmenu",
"title": "右键点击",
"description": "在右键菜单显示前触发。"
},
{
"name": "mousedown",
"title": "鼠标按下",
"description": "在元素上按下任意鼠标按钮时触发。"
},
{
"name": "mouseup",
"title": "鼠标释放",
"description": "在元素上释放任意鼠标按钮时触发。"
},
{
"name": "mouseenter",
"title": "鼠标移入",
"description": "鼠标移入元素时触发。"
},
{
"name": "mouseleave",
"title": "鼠标移出",
"description": "鼠标移出元素时触发。"
},
{
"name": "scroll",
"title": "滚动时",
"description": "滚动时触发",
"params": [
{
"name": "$event",
"type": "object",
"description": "滚动事件对象",
"schema": {
"$ref": "#/systemTypes/ScrollEvent"
}
},
{
"name": "$event.scrollHeight",
"type": "any",
"description": "滚动内容高度"
},
{
"name": "$event.scrollWidth",
"type": "any",
"description": "滚动内容宽度"
},
{
"name": "$event.scrollTop",
"type": "any",
"description": "滚动内容距离顶部高度"
},
{
"name": "$event.scrollLeft",
"type": "any",
"description": "滚动内容距离左侧宽度"
},
{
"name": "$event.clientHeight",
"type": "any",
"description": "可视区域高度"
},
{
"name": "$event.clientWidth",
"type": "any",
"description": "可视区域宽度"
}
]
}
],
"children": []
}
},
{
"symbol": "u-absolute-layout",
"name": "自由布局",
"icon": "absolute-layout",
"depDescription": {},
"description": "拖拽内部元素到任意位置",
"labels": [
"Layout"
],
"screenShot": "",
"blocks": "[{\"title\":\"自由布局\",\"description\":\"\",\"code\":\"<template>\\n<u-absolute-layout>\\n</u-absolute-layout>\\n</template>\\n\"}]",
"jsonSchema": {
"name": "u-absolute-layout",
"title": "自由布局",
"description": "拖拽内部元素到任意位置",
"category": "Layout",
"screenShot": "",
"drawings": "",
"blocks": [
{
"title": "自由布局",
"description": "",
"code": "<template>\n<u-absolute-layout>\n</u-absolute-layout>\n</template>\n"
}
],
"slots": [
{
"concept": "Slot",
"name": "default",
"description": "内容"
}
],
"events": [
{
"name": "click",
"title": "点击",
"description": "在元素上按下并释放任意鼠标按钮时触发。"
},
{
"name": "dblclick",
"title": "双击",
"description": "在元素上双击鼠标按钮时触发。"
},
{
"name": "contextmenu",
"title": "右键点击",
"description": "在右键菜单显示前触发。"
},
{
"name": "mousedown",
"title": "鼠标按下",
"description": "在元素上按下任意鼠标按钮时触发。"
},
{
"name": "mouseup",
"title": "鼠标释放",
"description": "在元素上释放任意鼠标按钮时触发。"
},
{
"name": "mouseenter",
"title": "鼠标移入",
"description": "鼠标移入元素时触发。"
},
{
"name": "mouseleave",
"title": "鼠标移出",
"description": "鼠标移出元素时触发。"
}
],
"next": true,
"nested": true,
"children": []
}
},
{
"symbol": "u-grid-layout",
"name": "栅格布局",
"icon": "grid-layout",
"depDescription": {},
"description": "内部元素按照一定的规则布局",
"labels": [
"Layout"
],
"screenShot": "https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-grid-layout.vue/screenshots/0.png,https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-grid-layout.vue/screenshots/1.png",
"blocks": "[{\"title\":\"3列样式(8:8:8)\",\"description\":\"\",\"code\":\"<template>\\n<u-grid-layout>\\n <u-grid-layout-row :repeat=\\\"24\\\">\\n <u-grid-layout-column :span=\\\"8\\\"></u-grid-layout-column>\\n <u-grid-layout-column :span=\\\"8\\\"></u-grid-layout-column>\\n <u-grid-layout-column :span=\\\"8\\\"></u-grid-layout-column>\\n </u-grid-layout-row>\\n</u-grid-layout>\\n</template>\\n\"},{\"title\":\"4列样式(2:4:8:10)\",\"description\":\"\",\"code\":\"<template>\\n<u-grid-layout>\\n <u-grid-layout-row :repeat=\\\"24\\\">\\n <u-grid-layout-column :span=\\\"2\\\"></u-grid-layout-column>\\n <u-grid-layout-column :span=\\\"4\\\"></u-grid-layout-column>\\n <u-grid-layout-column :span=\\\"8\\\"></u-grid-layout-column>\\n <u-grid-layout-column :span=\\\"10\\\"></u-grid-layout-column>\\n </u-grid-layout-row>\\n</u-grid-layout>\\n</template>\\n\"},{\"title\":\"2列样式(8:16)\",\"description\":\"\",\"code\":\"<template>\\n<u-grid-layout>\\n <u-grid-layout-row :repeat=\\\"24\\\">\\n <u-grid-layout-column :span=\\\"8\\\"></u-grid-layout-column>\\n <u-grid-layout-column :span=\\\"16\\\"></u-grid-layout-column>\\n </u-grid-layout-row>\\n</u-grid-layout>\\n</template>\\n\"}]",
"jsonSchema": {
"name": "u-grid-layout",
"title": "栅格布局",
"description": "内部元素按照一定的规则布局",
"category": "Layout",
"screenShot": "https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-grid-layout.vue/screenshots/0.png,https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-grid-layout.vue/screenshots/1.png",
"drawings": "https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-grid-layout.vue/drawings/0.svg,https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-grid-layout.vue/drawings/1.svg,https://static-vusion.163yun.com/packages/cloud-ui.vusion@0.18.20/src/components/u-grid-layout.vue/drawings/2.svg",
"blocks": [
{
"title": "3列样式(8:8:8)",
"description": "",
"code": "<template>\n<u-grid-layout>\n <u-grid-layout-row :repeat=\"24\">\n <u-grid-layout-column :span=\"8\"></u-grid-layout-column>\n <u-grid-layout-column :span=\"8\"></u-grid-layout-column>\n <u-grid-layout-column :span=\"8\"></u-grid-layout-column>\n </u-grid-layout-row>\n</u-grid-layout>\n</template>\n"
},
{
"title": "4列样式(2:4:8:10)",
"description": "",
"code": "<template>\n<u-grid-layout>\n <u-grid-layout-row :repeat=\"24\">\n <u-grid-layout-column :span=\"2\"></u-grid-layout-column>\n <u-grid-layout-column :span=\"4\"></u-grid-layout-column>\n <u-grid-layout-column :span=\"8\"></u-grid-layout-column>\n <u-grid-layout-column :span=\"10\"></u-grid-layout-column>\n </u-grid-layout-row>\n</u-grid-layout>\n</template>\n"
},
{
"title": "2列样式(8:16)",
"description": "",
"code": "<template>\n<u-grid-layout>\n <u-grid-layout-row :repeat=\"24\">\n <u-grid-layout-column :span=\"8\"></u-grid-layout-column>\n <u-grid-layout-column :span=\"16\"></u-grid-layout-column>\n </u-grid-layout-row>\n</u-grid-layout>\n</template>\n"
}
],
"attrs": [
{
"name": "gap",
"title": "行间隔",
"type": "string",
"options": [
{
"value": "compact",
"title": "紧凑(-1)"
},
{
"value": "none",
"title": "无(0)"
},
{
"value": "small",
"title": "小(8)"
},
{
"value": "normal",
"title": "正常(16)"
},
{
"value": "large",
"title": "大(32)"
}
],
"default": "normal",
"description": "栅格行之间的间隔",
"group": "样式属性",
"brifeDoc": "",
"docDescription": "支持修改栅格行之间的间隔,支持紧凑(-1)、无(0)、小(8)、正常(16)、大(32)共6种间隔模式。",
"tooltipLink": ""
}
],
"slots": [
{
"concept": "Slot",
"name": "default",
"description": "插入`<u-grid-layout-row>`或`<u-grid-layout-column>`子组件。",
"common-empty-background": true,
"support": [
{
"name": "u-grid-layout-row",
"title": "插入一行",
"snippet": "<u-grid-layout-row :repeat=\"24\"><u-grid-layout-column :span=\"8\"></u-grid-layout-column><u-grid-layout-column :span=\"8\"></u-grid-layout-column><u-grid-layout-column :span=\"8\"></u-grid-layout-column></u-grid-layout-row>"
}
]
}
],
"events": [
{
"name": "scroll",
"title": "滚动时",
"description": "滚动时触发",
"params": [
{
"name": "$event",
"type": "object",
"description": "滚动事件对象",
"schema": {
"$ref": "#/systemTypes/ScrollEvent"
}
},
{
"name": "$event.scrollHeight",
"type": "any",
"description": "滚动内容高度"
},
{
"name": "$event.scrollWidth",
"type": "any",
"description": "滚动内容宽度"
},
{
"name": "$event.scrollTop",
"type": "any",
"description": "滚动内容距离顶部高度"
},
{
"name": "$event.scrollLeft",
"type": "any",
"description": "滚动内容距离左侧宽度"
},
{
"name": "$event.clientHeight",
"type": "any",
"description": "可视区域高度"
},
{
"name": "$event.clientWidth",
"type": "any",
"description": "可视区域宽度"
}
]
}
],
"children": [
{
"name": "u-grid-layout-row",
"title": "栅格行",
"description": "内部元素行布局",
"attrs": [
{
"name": "justify",
"title": "横轴对齐",
"type": "string",
"display": "capsules",
"bindHide": true,
"options": [
{
"value": "start",
"title": "左对齐",
"icon": "horizontal-justify-start",
"tooltip": "左对齐"
},
{
"value": "center",
"title": "居中对齐",
"icon": "horizontal-justify-center",
"tooltip": "居中对齐"
},
{
"value": "end",
"title": "右对齐",
"icon": "horizontal-justify-end",
"tooltip": "右对齐"
},
{
"value": "space-between",
"title": "平均分布(两端不留空)",
"icon": "horizontal-justify-space-between",
"tooltip": "平均分布(两端不留空)"
},
{
"value": "space-around",
"title": "水平分布-左右留空",
"icon": "horizontal-justify-space-around",
"tooltip": "平均分布"
}
],
"default": "start",
"group": "主要属性",
"description": "",
"brifeDoc": "",
"docDescription": "支持左对齐、居中对齐、右对齐、平均分布(两端不留空)、平均分布。",
"tooltipLink": ""
},
{
"name": "alignment",
"title": "纵轴对齐",
"type": "string",
"display": "capsules",
"bindHide": true,
"options": [
{
"value": "start",
"title": "顶对齐",
"icon": "horizontal-alignment-start",
"tooltip": "顶对齐"
},
{
"value": "center",
"title": "垂直居中",
"icon": "horizontal-alignment-center",
"tooltip": "垂直居中"
},
{
"value": "end",
"title": "底对齐",
"icon": "horizontal-alignment-end",
"tooltip": "底对齐"
},
{
"value": "baseline",
"title": "行内文字基线对齐",
"icon": "horizontal-alignment-baseline",
"tooltip": "行内文字基线对齐"
},
{
"value": "stretch",
"title": "占满容器高度",
"icon": "horizontal-alignment-stretch",
"tooltip": "占满容器高度"
}
],
"default": "stretch",
"group": "主要属性",
"description": "",
"brifeDoc": "",
"docDescription": "支持顶对齐、垂直居中、底对齐、行内文字基线对齐、占满容器高度。",
"tooltipLink": ""
},
{
"name": "repeat",
"title": "栅格数",
"type": "number",
"display": "number",
"default": 12,
"description": "默认24,可设置栅格行大小",
"min": 1,
"max": 24,
"group": "主要属性",
"brifeDoc": "",
"docDescription": "支持设置栅格行大小,默认为24。",
"tooltipLink": ""
},
{
"name": "gap",
"title": "列间隔",
"type": "string",
"options": [
{
"value": "none",
"title": "无(0)"
},
{
"value": "mini",
"title": "迷你(4)"
},
{
"value": "small",
"title": "小(8)"
},
{
"value": "normal",
"title": "正常(16)"
},
{
"value": "large",
"title": "大(24)"
},
{
"value": "huge",
"title": "巨大(32)"
}
],
"default": "normal",
"description": "栅格列之间的间隔",
"group": "样式属性",
"brifeDoc": "",
"docDescription": "栅格列之间的间隔,支持无(0)、迷你(4)、小(8)、正常(16)、巨大(32)共6种间隔模式。",
"tooltipLink": ""
}
],
"slots": [
{
"concept": "Slot",
"name": "default",
"description": "插入`<u-grid-layout-column>`子组件。",
"support": [
{
"name": "u-grid-layout-column",
"title": "插入一列",
"snippet": "<u-grid-layout-column :span=\"1\"></u-grid-layout-column>"
}
]
}
]
},
{
"name": "u-grid-layout-column",
"title": "栅格列",
"description": "内部元素行内列布局",
"attrs": [
{
"name": "media-huge",
"title": "响应很大屏",
"type": "number",
"description": "响应式布局`<=1440px`的列跨越栅格数",
"advanced": true
},
{
"name": "media-large",
"title": "响应大屏",
"type": "number",
"description": "响应式布局`<=1200px`的列跨越栅格数",
"advanced": true
},
{
"name": "media-medium",
"title": "响应中屏",
"type": "number",
"description": "响应式布局`<=960px`的列跨越栅格数",
"advanced": true
},
{
"name": "media-small",
"title": "响应小屏",
"type": "number",
"description": "响应式布局`<=768px`的列跨越栅格数",
"advanced": true
},
{
"name": "media-mini",
"title": "响应迷你屏",
"type": "number",
"description": "响应式布局`<=480px`的列跨越栅格数",
"advanced": true
},
{
"name": "mode",
"title": "布局模式",
"type": "string",
"display": "capsules",
"bindHide": true,
"description": "",
"tooltipLink": "http://help.lcap.163yun.com/1.%E5%BC%80%E5%8F%91%E5%BA%94%E7%94%A8/2.%E9%A1%B5%E9%9D%A2/05.PC%E9%A1%B5%E9%9D%A2%E5%9F%BA%E7%A1%80%E7%BB%84%E4%BB%B6/01.%E5%B8%83%E5%B1%80/030.%E6%A0%85%E6%A0%BC%E5%B8%83%E5%B1%80.html",
"options": [
{
"value": "inline",
"title": "块级",
"icon": "layout-inline-block",
"tooltip": "内联布局"
},
{
"value": "flex",
"title": "弹性",
"icon": "layout-flex",
"tooltip": "弹性布局"
}
],
"default": "inline",
"toggleclear": [
"justify",
"alignment",
"wrap",
"gap"
],
"group": "主要属性",
"brifeDoc": "",
"docDescription": "内联布局:将当前元素修改为内联布局模式,各个内联布局模式的元素将默认排布在同一行中,若空间不足以排布下一个内联布局元素,则该元素将会换行。弹性布局:在弹性布局模式中,子元素可以在任何方向上排布,也可以“弹性伸缩”其尺寸,既可以增加尺寸以填满未使用的空间,也可以收缩尺寸以避免溢出父元素。"
},
{
"name": "direction",
"title": "主轴方向",
"type": "string",
"display": "capsules",
"bindHide": true,
"options": [
{
"value": "horizontal",
"title": "横向排列",
"icon": "flex-horizontal",
"tooltip": "横向"
},
{
"value": "vertical",
"title": "纵向排列",
"icon": "flex-vertical",
"tooltip": "纵向"
}
],
"default": "horizontal",
"toggleclear": [
"justify",
"alignment"
],
"dependency": [
{
"mode": "flex"
}
],
"group": "主要属性",
"description": "",
"brifeDoc": "",
"docDescription": "横向:内部子元素进行横向排布,建议内部子元素使用行内布局。纵向:内部子元素进行纵向排布,建议内部子元素使用块级布局。",
"tooltipLink": ""
},
{
"name": "justify",
"title": "横轴对齐",
"type": "string",
"display": "capsules",
"bindHide": true,
"options": [
{
"value": "start",
"title": "左对齐",
"icon": "horizontal-justify-start",
"tooltip": "左对齐"
},
{
"value": "center",
"title": "居中对齐",
"icon": "horizontal-justify-center",
"tooltip": "居中对齐"
},
{
"value": "end",
"title": "右对齐",
"icon": "horizontal-justify-end",
"tooltip": "右对齐"
},
{