Tabs 标签页

基础用法

Tabs 标签页 - 图1

  1. {
  2.   "type": "tabs",
  3.   "options": {
  4.     "tab1": "tab1",
  5.     "tab2": "tab2"
  6.   },
  7.   "blocks": {
  8.     "tab1": {
  9.       "type": "component",
  10.       "options": {
  11.         "is": "div",
  12.         "text": "我是tabs1的内容"
  13.       },
  14.       "style": {
  15.         "padding": "100px"
  16.       }
  17.     },
  18.     "tab2": {
  19.       "type": "component",
  20.       "options": {
  21.         "is": "div",
  22.         "text": "我是tabs2的内容"
  23.       },
  24.       "style": {
  25.         "padding": "100px"
  26.       }
  27.     }
  28.   },
  29.   "operations": {
  30.     "hide": {
  31.       "type": "icon",
  32.       "label": "关闭",
  33.       "props": {
  34.         "class": "el-icon-close"
  35.       }
  36.     }
  37.   }
  38. }

显示配置

在线实验室

Tabs 标签页 - 图2

Tabs 标签页 - 图3

参数列表

参数说明可选值 | 类型必填
typeblock类型string是
datadata可以指定当前block的初始数据，结构和fields保持一致null | object否
config全局配置，和通过ams.config配置效果一致null | object否
style可以设置区块的外层样式null | object否
events可以配置对应事件的处理actionsnull | object否
actions可以配置具体的action处理函数null | object否
operations可以配置operation操作null | object否
blocks可以配置多个子blocknull | object否
render默认为false，配置为true则自动在body内渲染，如传入string则渲染在指定的querySelector上boolean | string否
props会透传至底层的element-ui组件作为props属性，或者是原生dom元素的属性null | object否
optionsblock特有配置null | object否