JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2026-06-04 23:33:13 +08:00
Code Issues Projects Releases Wiki Activity
tmagic-editor/docs/form-config/layout.html
github-actions[bot] ffcb807738 Deploy to GitHub pages
2026-06-02 11:11:57 +00:00

477 lines
158 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en-US" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>布局 | tmagic-editor</title>
<meta name="description" content="页面可视化平台">
<meta name="generator" content="VitePress v2.0.0-alpha.17">
<link rel="preload stylesheet" href="/tmagic-editor/docs/assets/style.B2Y-cHQK.css" as="style">
<link rel="preload stylesheet" href="/tmagic-editor/docs/vp-icons.css" as="style">
<script type="module" src="/tmagic-editor/docs/assets/app.BzF5rDWV.js"></script>
<link rel="preload" href="/tmagic-editor/docs/assets/inter-roman-latin.Cy4MYw_J.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/tmagic-editor/docs/assets/chunks/theme.osynohDU.js">
<link rel="modulepreload" href="/tmagic-editor/docs/assets/chunks/framework.V2ssSR2R.js">
<link rel="modulepreload" href="/tmagic-editor/docs/assets/form-config_layout.md.BQhGI4Qq.lean.js">
<meta name="theme-color" content="#646cff">
<script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
<script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
</head>
<body>
<div id="app"><div class="Layout" data-v-52085faa><!--[--><!--]--><!--[--><span tabindex="-1" data-v-002a3b7b></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-002a3b7b>Skip to content</a><!--]--><!----><header class="VPNav" data-v-52085faa data-v-66bfbe5f><div class="VPNavBar has-sidebar top" data-v-66bfbe5f data-v-e3720e23><div class="wrapper" data-v-e3720e23><div class="container" data-v-e3720e23><div class="title" data-v-e3720e23><div class="VPNavBarTitle has-sidebar" data-v-e3720e23 data-v-0cf55604><a class="title" href="/tmagic-editor/docs/" data-v-0cf55604><!--[--><!--]--><!--[--><img class="VPImage logo" src="./favicon.png" alt data-v-9c21079f><!--]--><span data-v-0cf55604>tmagic-editor</span><!--[--><!--]--></a></div></div><div class="content" data-v-e3720e23><div class="content-body" data-v-e3720e23><!--[--><!--]--><div class="VPNavBarSearch search" data-v-e3720e23 data-v-aeb47f76><!--[--><button type="button" class="VPNavBarSearchButton" aria-label="Search" aria-keyshortcuts="/ control+k meta+k" data-v-aeb47f76 data-v-9cf61dd5><span class="vpi-search" aria-hidden="true" data-v-9cf61dd5></span><span class="text" data-v-9cf61dd5>Search</span><span class="keys" aria-hidden="true" data-v-9cf61dd5><kbd class="key-cmd" data-v-9cf61dd5>⌘</kbd><kbd class="key-ctrl" data-v-9cf61dd5>Ctrl</kbd><kbd data-v-9cf61dd5>K</kbd></span></button><!----><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-e3720e23 data-v-ec5ae824><span id="main-nav-aria-label" class="visually-hidden" data-v-ec5ae824> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/tmagic-editor/docs/guide/" tabindex="0" data-v-ec5ae824 data-v-43d45074><!--[--><span data-v-43d45074>文档</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/tmagic-editor/docs/api/editor/props.html" tabindex="0" data-v-ec5ae824 data-v-43d45074><!--[--><span data-v-43d45074>Editor API</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/tmagic-editor/docs/runtime-api/core/app.html" tabindex="0" data-v-ec5ae824 data-v-43d45074><!--[--><span data-v-43d45074>Runtime API</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/tmagic-editor/docs/form-config/fields/text.html" tabindex="0" data-v-ec5ae824 data-v-43d45074><!--[--><span data-v-43d45074>表单配置</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://github.com/Tencent/tmagic-editor/releases" target="_blank" rel="noreferrer" tabindex="0" data-v-ec5ae824 data-v-43d45074><!--[--><span data-v-43d45074>更新日志</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://tencent.github.io/tmagic-editor/playground/index.html" target="_blank" rel="noreferrer" tabindex="0" data-v-ec5ae824 data-v-43d45074><!--[--><span data-v-43d45074>Playground</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-e3720e23 data-v-6416f7b5><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-6416f7b5 data-v-7ddf7f6f data-v-8006726c><span class="check" data-v-8006726c><span class="icon" data-v-8006726c><!--[--><span class="vpi-sun sun" data-v-7ddf7f6f></span><span class="vpi-moon moon" data-v-7ddf7f6f></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-e3720e23 data-v-77e51d27 data-v-03e62622><!--[--><a class="VPSocialLink no-icon" href="https://github.com/Tencent/tmagic-editor" aria-label="github" target="_blank" rel="me noopener" data-v-03e62622 data-v-e80c6f77><span class="vpi-social-github"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-e3720e23 data-v-b1acd709 data-v-4b9197ed><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-4b9197ed><span class="vpi-more-horizontal icon" data-v-4b9197ed></span></button><div class="menu" data-v-4b9197ed><div class="VPMenu" data-v-4b9197ed data-v-a395f093><!----><!--[--><!--[--><!----><div class="group" data-v-b1acd709><div class="item appearance" data-v-b1acd709><p class="label" data-v-b1acd709>Appearance</p><div class="appearance-action" data-v-b1acd709><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-b1acd709 data-v-7ddf7f6f data-v-8006726c><span class="check" data-v-8006726c><span class="icon" data-v-8006726c><!--[--><span class="vpi-sun sun" data-v-7ddf7f6f></span><span class="vpi-moon moon" data-v-7ddf7f6f></span><!--]--></span></span></button></div></div></div><div class="group" data-v-b1acd709><div class="item social-links" data-v-b1acd709><div class="VPSocialLinks social-links-list" data-v-b1acd709 data-v-03e62622><!--[--><a class="VPSocialLink no-icon" href="https://github.com/Tencent/tmagic-editor" aria-label="github" target="_blank" rel="me noopener" data-v-03e62622 data-v-e80c6f77><span class="vpi-social-github"></span></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-e3720e23 data-v-bd3703a2><span class="container" data-v-bd3703a2><span class="top" data-v-bd3703a2></span><span class="middle" data-v-bd3703a2></span><span class="bottom" data-v-bd3703a2></span></span></button></div></div></div></div><div class="divider" data-v-e3720e23><div class="divider-line" data-v-e3720e23></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-52085faa data-v-0d424459><div class="container" data-v-0d424459><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-0d424459><span class="vpi-align-left menu-icon" data-v-0d424459></span><span class="menu-text" data-v-0d424459>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-0d424459 data-v-9e866da0><button data-v-9e866da0>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-52085faa data-v-b300e040><div class="curtain" data-v-b300e040></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b300e040><span class="visually-hidden" id="sidebar-aria-label" data-v-b300e040> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-cd5b1edc><section class="VPSidebarItem level-0" data-v-cd5b1edc data-v-edbe517d><div class="item" role="button" tabindex="0" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><h2 class="text" data-v-edbe517d>基础配置</h2><!----></div><div class="items" data-v-edbe517d><!--[--><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/text.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Input输入框</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/textarea.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Textarea文本域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/number.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>InputNumber计数器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/number-range.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>NumberRange数字范围</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/display.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Display只读文本</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/hidden.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Hidden隐藏域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/link.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Link链接</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/checkbox.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Checkbox多选框</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/radio.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Radio单选框</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/switch.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Switch开关</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/select.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Select选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/cascader.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Cascader级联选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/color-picker.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>ColorPicker颜色选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/date-picker.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DatePick日期选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/daterange-picker.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DateRangePick日期范围选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/datetime-picker.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DatetimePick日期时间选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/time-picker.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>TimePick时间选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/timerange-picker.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>TimeRangePick时间范围选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/fields/dynamic-field.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DynamicField动态表单</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-cd5b1edc><section class="VPSidebarItem level-0" data-v-cd5b1edc data-v-edbe517d><div class="item" role="button" tabindex="0" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><h2 class="text" data-v-edbe517d>编辑器中可用配置</h2><!----></div><div class="items" data-v-edbe517d><!--[--><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/code.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>Code代码编辑器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/code-link.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>CodeLink代码链接</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/code-select.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>CodeSelect代码块选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/code-select-col.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>CodeSelectCol代码块选择列</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/data-source-select.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DataSourceSelect数据源选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/data-source-field-select.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DataSourceFieldSelect数据源字段选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/data-source-method-select.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DataSourceMethodSelect数据源方法选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/data-source-fields.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DataSourceFields数据源字段配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/data-source-input.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DataSourceInput数据源输入框</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/data-source-methods.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DataSourceMethods数据源方法配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/data-source-mocks.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DataSourceMocks数据源Mock配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/ui-select.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>UISelect组件选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/key-value.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>KeyValue键值对</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/page-fragment-select.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>PageFragmentSelect页面片选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/event-select.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>EventSelect事件选择器</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/display-conds.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>DisplayConds显示条件配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/editor-fields/cond-op-select.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>CondOpSelect条件操作选择器</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-cd5b1edc><section class="VPSidebarItem level-0 has-active" data-v-cd5b1edc data-v-edbe517d><div class="item" role="button" tabindex="0" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><h2 class="text" data-v-edbe517d>布局配置</h2><!----></div><div class="items" data-v-edbe517d><!--[--><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/layout.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>布局</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-cd5b1edc><section class="VPSidebarItem level-0" data-v-cd5b1edc data-v-edbe517d><div class="item" role="button" tabindex="0" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><h2 class="text" data-v-edbe517d>联动配置</h2><!----></div><div class="items" data-v-edbe517d><!--[--><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/relate.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>联动</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-cd5b1edc><section class="VPSidebarItem level-0" data-v-cd5b1edc data-v-edbe517d><div class="item" role="button" tabindex="0" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><h2 class="text" data-v-edbe517d>表单对比</h2><!----></div><div class="items" data-v-edbe517d><!--[--><div class="VPSidebarItem level-1 is-link" data-v-edbe517d data-v-edbe517d><div class="item" data-v-edbe517d><div class="indicator" data-v-edbe517d></div><a class="VPLink link link" href="/tmagic-editor/docs/form-config/compare.html" data-v-edbe517d><!--[--><p class="text" data-v-edbe517d>表单对比</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-52085faa data-v-e4a435e4><div class="VPDoc has-sidebar has-aside" data-v-e4a435e4 data-v-e240b221><!--[--><!--]--><div class="container" data-v-e240b221><div class="aside" data-v-e240b221><div class="aside-curtain" data-v-e240b221></div><div class="aside-container" data-v-e240b221><div class="aside-content" data-v-e240b221><div class="VPDocAside" data-v-e240b221 data-v-29ae77ab><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-29ae77ab data-v-9a0a5036><div class="content" data-v-9a0a5036><div class="outline-marker" data-v-9a0a5036></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-9a0a5036>On this page</div><ul class="VPDocOutlineItem root" data-v-9a0a5036 data-v-97ea2a1e><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-29ae77ab></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-e240b221><div class="content-container" data-v-e240b221><!--[--><!--]--><main class="main" data-v-e240b221><div style="position:relative;" class="vp-doc _tmagic-editor_docs_form-config_layout" data-v-e240b221><div><h1 id="布局" tabindex="-1">布局 <a class="header-anchor" href="#布局" aria-label="Permalink to “布局”">​</a></h1><h2 id="配置类型" tabindex="-1">配置类型 <a class="header-anchor" href="#配置类型" aria-label="Permalink to “配置类型”">​</a></h2><details class="details custom-block"><summary>查看 ContainerCommonConfig / RowConfig / TabConfig / TabPaneConfig / FieldsetConfig / PanelConfig / StepConfig / FlexLayoutConfig / GroupListConfig / TableConfig / TableColumnConfig / TableGroupListCommonConfig 配置类型定义</summary><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ContainerCommonConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormItem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> items</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> onInitValue</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> formValue</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormValue</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> initValue</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormValue</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormValue</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> extensible</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> RowConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormItem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> type</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;row&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> span</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> items</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ({ </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">span</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&amp;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">ChildConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> EditorChildConfig</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">))[];</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TabConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormItem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">ContainerCommonConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> type</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;tab&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;dynamic-tab&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> tabType</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> editable</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> dynamic</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> tabPosition</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;top&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;right&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;bottom&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;left&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 当前激活的标签页，可以是固定值或动态函数 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> active</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ((</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">model</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormValue</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">; </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">formValue</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormValue</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">; </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">prop</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> items</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TabPaneConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;[];</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> onChange</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> onTabAdd</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> onTabRemove</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">tabName</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> onTabClick</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">tab</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> activeChange</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">tabName</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TabPaneConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> status</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 标签页名称，用于关联 model 中的数据 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> name</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> title</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> lazy</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> labelWidth</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> items</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> display</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;expand&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;expand&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> onTabClick</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">tab</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FieldsetConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormItem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">ContainerCommonConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> type</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;fieldset&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> checkbox</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> name</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> trueValue</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> falseValue</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> };</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> expand</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> legend</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> schematic</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> PanelConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormItem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">ContainerCommonConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> type</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;panel&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> expand</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> title</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> schematic</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> StepConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormItem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> type</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;step&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 每个 step 的间距，不填写将自适应间距。支持百分比。 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> space</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> items</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> StepItemConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;[];</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FlexLayoutConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormItem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">ContainerCommonConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> type</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;flex-layout&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** flex 子项间距，默认 &#39;16px&#39; */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> gap</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> GroupListConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TableGroupListCommonConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> span</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> items</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> groupItems</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> tableItems</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> titleKey</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> titlePrefix</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> title</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> itemExtra</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> expandAll</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /**</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> * 默认展开的数量，用于控制分组列表默认展示的项数</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> * 当设置为数字时，表示默认展开指定数量的项</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> * 当未设置时，默认展开第一项</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> defaultExpandQuantity</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> delete</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">model</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">index</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> symbol</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">values</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> copyable</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> movable</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> index</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> symbol</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> model</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> groupModel</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> moveSpecifyLocation</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TableConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TableGroupListCommonConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> items</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TableColumnConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;[];</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> tableItems</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TableColumnConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;[];</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> groupItems</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TableColumnConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;[];</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 最大高度 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> maxHeight</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> border</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 显示行号 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> showIndex</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 操作栏宽度 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> operateColWidth</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> pagination</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 是否显示删除按钮 */</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> delete</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">model</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">index</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">values</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> copyable</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">model</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 是否显示导入按钮 */</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> importable</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;undefined&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 是否显示checkbox */</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> selection</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;single&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> copyHandler</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> onSelect</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">@deprecated</span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> 请使用 defaultSort */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> defautSort</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> SortProp</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> defaultSort</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> SortProp</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 是否支持拖拽排序 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> dropSort</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> dropSortHandle</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> dropActionButtonIcon</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> copyActionButtonIcon</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> deleteActionButtonIcon</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 是否显示全屏按钮 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> enableFullscreen</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> fixed</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;left&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;right&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> itemExtra</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> titleTip</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> rowKey</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> sort</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> sortKey</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TableColumnConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> never</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt; </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormItem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> name</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> label</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> text</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> width</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> sortable</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> items</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> itemsFunction</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">row</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormConfig</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> titleTip</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> type</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> addButtonConfig</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> props</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Record</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> text</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> };</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TableGroupListCommonConfig</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormItem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> type</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;table&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;groupList&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;group-list&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> enableToggleMode</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 最大行数 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> max</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> enum</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">[];</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 是否显示添加按钮 */</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> addable</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;undefined&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 新增的默认行，可以是函数动态生成或静态对象 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> defaultAdd</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ((</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Record</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** table 新增行时前置回调 */</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> beforeAddRow</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">mForm</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> undefined</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FormItem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** vnode的key值，默认是遍历数组时的index */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> __key</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 表单域标签的的宽度，例如 &#39;50px&#39;。支持 auto。 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> labelWidth</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** label 标签的title属性 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> labelTitle</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> className</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 字段名 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> name</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 额外的提示信息，和 help 类似，当提示文案同时出现时，可以使用这个。 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> extra</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 配置提示信息 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> tooltip</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ToolTipConfigType</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">ToolTipConfigType</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 是否置灰 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> disabled</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 使用表单中的值作为key，例如配置了text，则使用model.text作为key */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> key</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 是否显示 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> display</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;expand&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">boolean</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;expand&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 值发生改变时调用的方法 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> onChange</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> OnChangeHandler</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** label 标签的文本 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> text</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> FilterFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 右侧感叹号 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> tip</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> filter</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;number&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> OnChangeHandler</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 是否去除首尾空格 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> trim</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 默认值 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> defaultValue</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> DefaultValueFunction</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 表单验证规则 */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> rules</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Rule</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">[];</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> extensible</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> dynamicKey</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> /** 是否需要显示`展开更多配置` */</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> expand</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> style</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Record</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> fieldStyle</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Record</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> labelPosition</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;top&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;left&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;right&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div></details><h2 id="基础用法" tabindex="-1">基础用法 <a class="header-anchor" href="#基础用法" aria-label="Permalink to “基础用法”">​</a></h2><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text2&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text3&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置3&quot;</span>
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2063;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-188" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><h2 id="行内布局" tabindex="-1">行内布局 <a class="header-anchor" href="#行内布局" aria-label="Permalink to “行内布局”">​</a></h2><p>可以通过配置span，来指定行内的配置项占用多少位置，一行为24，例如一行要显示三个配置则 span 可以配置 8；四个则为 6。默认会自动调节在一行中显示。</p><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;row&quot;</span>,
<span class="hljs-attr">labelWidth</span>: <span class="hljs-string">&quot;100px&quot;</span>,
<span class="hljs-attr">span</span>: <span class="hljs-number">8</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text2&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text3&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置3&quot;</span>
}
]
},
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;row&quot;</span>,
<span class="hljs-attr">span</span>: <span class="hljs-number">12</span>,
<span class="hljs-attr">labelWidth</span>: <span class="hljs-string">&quot;100px&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text4&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text5&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text6&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置3&quot;</span>
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2064;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-191" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><h2 id="混合布局" tabindex="-1">混合布局 <a class="header-anchor" href="#混合布局" aria-label="Permalink to “混合布局”">​</a></h2><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text0&quot;</span>,
<span class="hljs-attr">labelWidth</span>: <span class="hljs-string">&quot;100px&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置0&quot;</span>
},
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;row&quot;</span>,
<span class="hljs-attr">labelWidth</span>: <span class="hljs-string">&quot;100px&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text2&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text3&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置3&quot;</span>
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2065;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-194" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><h2 id="对象容器" tabindex="-1">对象容器 <a class="header-anchor" href="#对象容器" aria-label="Permalink to “对象容器”">​</a></h2><h3 id="object" tabindex="-1">Object <a class="header-anchor" href="#object" aria-label="Permalink to “Object”">​</a></h3><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;data&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text2&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text3&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置3&quot;</span>
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2066;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-197" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><h3 id="fieldset" tabindex="-1">fieldset <a class="header-anchor" href="#fieldset" aria-label="Permalink to “fieldset”">​</a></h3><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;fieldset&quot;</span>,
<span class="hljs-attr">labelWidth</span>: <span class="hljs-string">&quot;100px&quot;</span>,
<span class="hljs-attr">legend</span>: <span class="hljs-string">&quot;fieldset&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>
},
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;row&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text2&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text3&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置3&quot;</span>
}
]
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2067;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-200" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><p><code>legend</code> 除了支持字符串，也支持函数，函数返回值作为标题展示，可根据表单数据动态生成：</p><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;fieldset&quot;</span>,
<span class="hljs-attr">labelWidth</span>: <span class="hljs-string">&quot;100px&quot;</span>,
<span class="hljs-attr">legend</span>: <span class="hljs-function">(<span class="hljs-params">mForm, { formValue }</span>) =&gt;</span> <span class="hljs-string">`当前值：<span class="hljs-subst">${formValue.text || <span class="hljs-string">&quot;空&quot;</span>}</span>`</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2068;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-203" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><h3 id="panel" tabindex="-1">panel <a class="header-anchor" href="#panel" aria-label="Permalink to “panel”">​</a></h3><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;panel&quot;</span>,
<span class="hljs-attr">title</span>: <span class="hljs-string">&quot;panel&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>
},
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;row&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text2&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text3&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置3&quot;</span>
}
]
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2069;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-206" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><h3 id="tabs" tabindex="-1">tabs <a class="header-anchor" href="#tabs" aria-label="Permalink to “tabs”">​</a></h3><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;tab&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">title</span>: <span class="hljs-string">&quot;tab1&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>
}
]
},
{
<span class="hljs-attr">title</span>: <span class="hljs-string">&quot;tab2&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text2&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text3&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置3&quot;</span>
}
]
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2070;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-209" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><h2 id="数组容器" tabindex="-1">数组容器 <a class="header-anchor" href="#数组容器" aria-label="Permalink to “数组容器”">​</a></h2><h3 id="grouplist" tabindex="-1">groupList <a class="header-anchor" href="#grouplist" aria-label="Permalink to “groupList”">​</a></h3><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;groupList&quot;</span>,
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;group&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>
},
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;row&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text2&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text3&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置3&quot;</span>
}
]
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2071;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-212" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><h3 id="table" tabindex="-1">table <a class="header-anchor" href="#table" aria-label="Permalink to “table”">​</a></h3><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;table&quot;</span>,
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;table&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">label</span>: <span class="hljs-string">&quot;配置1&quot;</span>
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2072;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-215" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><h3 id="step" tabindex="-1">step <a class="header-anchor" href="#step" aria-label="Permalink to “step”">​</a></h3><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;step&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">title</span>: <span class="hljs-string">&quot;步骤1&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>
}
]
},
{
<span class="hljs-attr">title</span>: <span class="hljs-string">&quot;步骤2&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text2&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>
}
]
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2073;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-218" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div><h3 id="flex-layout" tabindex="-1">flex-layout <a class="header-anchor" href="#flex-layout" aria-label="Permalink to “flex-layout”">​</a></h3><div class="demo-block demo-zh-CN}"><div class="source"><!--[--><!--]--><form class="el-form el-form--default el-form--label-right tmagic-design-form m-form" style="height:auto;"><!--[--><!--]--></form></div><div class="meta"><div class="description"><pre><code lass="language-javascript hljs">[
{
<span class="hljs-attr">type</span>: <span class="hljs-string">&quot;flex-layout&quot;</span>,
<span class="hljs-attr">gap</span>: <span class="hljs-string">&quot;20px&quot;</span>,
<span class="hljs-attr">items</span>: [
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置1&quot;</span>,
<span class="hljs-attr">span</span>: <span class="hljs-number">12</span>
},
{
<span class="hljs-attr">name</span>: <span class="hljs-string">&quot;text2&quot;</span>,
<span class="hljs-attr">text</span>: <span class="hljs-string">&quot;配置2&quot;</span>,
<span class="hljs-attr">span</span>: <span class="hljs-number">12</span>
}
]
}
]</code></pre></div><div class="highlight"><!--[--><!--]--></div></div><div class="demo-block-control"><i class="el-icon-caret-bottom"></i><span>显示配置</span><!--[--><button ariadisabled="false" type="button" class="el-button el-button--primary el-button--small is-text control-button el-tooltip__trigger" style=""><!--v-if--><span class=""><!--[-->查看结果<!--]--></span></button><!--teleport start--><!--teleport end--><!--]--></div><!--[--><div class="el-overlay el-modal-dialog" style="z-index:2074;display:none;"><!--[--><div role="dialog" aria-modal="true" aria-label="result" aria-describedby="el-id-7378-221" class="el-overlay-dialog" style=""><!--[--><!--]--></div><!--]--></div><!--]--></div></div></div></main><footer class="VPDocFooter" data-v-e240b221 data-v-5ee03efa><!--[--><!--]--><!----><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-5ee03efa><span class="visually-hidden" id="doc-footer-aria-label" data-v-5ee03efa>Pager</span><div class="pager" data-v-5ee03efa><a class="VPLink link pager-link prev" href="/tmagic-editor/docs/form-config/editor-fields/cond-op-select.html" data-v-5ee03efa><!--[--><span class="desc" data-v-5ee03efa>Previous page</span><span class="title" data-v-5ee03efa>CondOpSelect条件操作选择器</span><!--]--></a></div><div class="pager" data-v-5ee03efa><a class="VPLink link pager-link next" href="/tmagic-editor/docs/form-config/relate.html" data-v-5ee03efa><!--[--><span class="desc" data-v-5ee03efa>Next page</span><span class="title" data-v-5ee03efa>联动</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-52085faa data-v-b8960fa3><div class="container" data-v-b8960fa3><p class="message" data-v-b8960fa3>Powered by 腾讯视频会员平台技术中心</p><p class="copyright" data-v-b8960fa3>Copyright (C) 2025 Tencent.</p></div></footer><!--[--><!--]--></div></div>
<script>window.__VP_HASH_MAP__=JSON.parse("{\"api_editor_codeblockservicemethods.md\":\"DTx312ti\",\"api_editor_componentlistservicemethods.md\":\"NIwatNAh\",\"api_editor_datasourceservicemethods.md\":\"CH5NYqED\",\"api_editor_editorserviceevents.md\":\"DkdzACfI\",\"api_editor_editorservicemethods.md\":\"DU_tD9c_\",\"api_editor_events.md\":\"Dsc4NqMg\",\"api_editor_eventsservicemethods.md\":\"Bw1rmuNy\",\"api_editor_historyserviceevents.md\":\"CrBB2Z2T\",\"api_editor_historyservicemethods.md\":\"B9GCvSyl\",\"api_editor_props.md\":\"BEsbIyE6\",\"api_editor_propsserviceevents.md\":\"CznK704B\",\"api_editor_propsservicemethods.md\":\"CHnpUlWe\",\"api_editor_slots.md\":\"B1B73apK\",\"api_editor_storageservicemethods.md\":\"XM0kc8xb\",\"api_editor_uiservicemethods.md\":\"CaCmG806\",\"api_form_form-dialog-events.md\":\"Bsi7I9tr\",\"api_form_form-dialog-methods.md\":\"B_sgIgX8\",\"api_form_form-dialog-props.md\":\"BfYnG4uw\",\"api_form_form-events.md\":\"C8SsDKZ6\",\"api_form_form-methods.md\":\"aycnh5FX\",\"api_form_form-props.md\":\"CnIXk9AC\",\"api_form_submit-form.md\":\"BkueFK3n\",\"api_stage_coreevents.md\":\"Cgw_NWIw\",\"api_stage_coremethods.md\":\"BfJZoQ1-\",\"api_table_events.md\":\"ANzBnLY7\",\"api_table_methods.md\":\"DKsUhNyQ\",\"api_table_props.md\":\"8p93oj03\",\"form-config_compare.md\":\"BmhAWdnU\",\"form-config_editor-fields_code-link.md\":\"_WpUScRP\",\"form-config_editor-fields_code-select-col.md\":\"5v2NiQs-\",\"form-config_editor-fields_code-select.md\":\"tFuJKxmz\",\"form-config_editor-fields_code.md\":\"QLtMzjkL\",\"form-config_editor-fields_cond-op-select.md\":\"DuVk7Plf\",\"form-config_editor-fields_data-source-field-select.md\":\"l-mtFHlA\",\"form-config_editor-fields_data-source-fields.md\":\"DuPucaNA\",\"form-config_editor-fields_data-source-input.md\":\"Cls0ZVmf\",\"form-config_editor-fields_data-source-method-select.md\":\"BQ9ihZav\",\"form-config_editor-fields_data-source-methods.md\":\"D4eLoaZh\",\"form-config_editor-fields_data-source-mocks.md\":\"BxEpd6-f\",\"form-config_editor-fields_data-source-select.md\":\"BeMf8tjW\",\"form-config_editor-fields_display-conds.md\":\"DthLWdef\",\"form-config_editor-fields_event-select.md\":\"Ct78kypt\",\"form-config_editor-fields_key-value.md\":\"BBSWwoHC\",\"form-config_editor-fields_page-fragment-select.md\":\"C4a_ieVQ\",\"form-config_editor-fields_ui-select.md\":\"DeBRlgMj\",\"form-config_fields_cascader.md\":\"Ad-9vSWz\",\"form-config_fields_checkbox.md\":\"DA3EU5r9\",\"form-config_fields_color-picker.md\":\"ChtAlvyA\",\"form-config_fields_date-picker.md\":\"BLpndPyR\",\"form-config_fields_daterange-picker.md\":\"BeDfHdP5\",\"form-config_fields_datetime-picker.md\":\"DKx6HjF1\",\"form-config_fields_display.md\":\"FpktLnh9\",\"form-config_fields_dynamic-field.md\":\"D-qL57IR\",\"form-config_fields_hidden.md\":\"CwIk9R6T\",\"form-config_fields_link.md\":\"CZP0Pwde\",\"form-config_fields_number-range.md\":\"D9w-K4YH\",\"form-config_fields_number.md\":\"BP6zDFhk\",\"form-config_fields_radio.md\":\"fpqLi6D8\",\"form-config_fields_select.md\":\"Busav8N-\",\"form-config_fields_switch.md\":\"CDph7J3q\",\"form-config_fields_text.md\":\"DSP7CO2W\",\"form-config_fields_textarea.md\":\"Cil4hAqw\",\"form-config_fields_time-picker.md\":\"BIgdvB4T\",\"form-config_fields_timerange-picker.md\":\"kRMAFTrr\",\"form-config_layout.md\":\"BQhGI4Qq\",\"form-config_relate.md\":\"DvsbvOrz\",\"guide_advanced_code-block.md\":\"CRnQiSUe\",\"guide_advanced_coupling.md\":\"QzzEWi8z\",\"guide_advanced_data-source.md\":\"aV48AJ93\",\"guide_advanced_history-list.md\":\"DiAyWX3H\",\"guide_advanced_js-schema.md\":\"DXahSd8l\",\"guide_advanced_layout.md\":\"m3-E5MCg\",\"guide_advanced_page.md\":\"DtD6IjTT\",\"guide_advanced_tmagic-form.md\":\"BGo1HV71\",\"guide_component.md\":\"ClwHnKxy\",\"guide_conception.md\":\"BvWRTJve\",\"guide_editor-expand.md\":\"DPpw0fx9\",\"guide_index.md\":\"C9UYRlPd\",\"guide_introduction.md\":\"D4FioLjl\",\"guide_migration.md\":\"Ce1OLlPP\",\"guide_publish.md\":\"BkTaAJA2\",\"guide_runtime.md\":\"JZ9evVO4\",\"guide_tutorial_hello-world.md\":\"D89qcYij\",\"guide_tutorial_index.md\":\"CHgYShbW\",\"guide_tutorial_render.md\":\"Ck2bd1u7\",\"guide_tutorial_runtime.md\":\"CSNPMbNQ\",\"index.md\":\"yV4-lxaL\",\"runtime-api_core_app.md\":\"DvMcbTo5\",\"runtime-api_core_devtoolapi.md\":\"Dt64oZTL\",\"runtime-api_core_env.md\":\"BWNcvewl\",\"runtime-api_core_eventhelper.md\":\"CTcULNOH\",\"runtime-api_core_flowstate.md\":\"B4jkAJTv\",\"runtime-api_core_iteratorcontainer.md\":\"BOxfQgFl\",\"runtime-api_core_node.md\":\"DLCapBPL\",\"runtime-api_core_page.md\":\"Bzc2uHYw\",\"runtime-api_core_utils.md\":\"WYx95Kix\",\"runtime-api_data-source_datasource.md\":\"DiemAPn7\",\"runtime-api_data-source_datasourcemanager.md\":\"eR5GBSIC\",\"runtime-api_data-source_httpdatasource.md\":\"D3tOijZy\",\"runtime-api_data-source_observeddata.md\":\"Dvqp1Z-P\",\"runtime-api_data-source_utils.md\":\"Be3cnv3y\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"tmagic-editor\",\"description\":\"页面可视化平台\",\"base\":\"/tmagic-editor/docs/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"logo\":\"./favicon.png\",\"search\":{\"provider\":\"local\"},\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/Tencent/tmagic-editor\"}],\"footer\":{\"message\":\"Powered by 腾讯视频会员平台技术中心\",\"copyright\":\"Copyright (C) 2025 Tencent.\"},\"nav\":[{\"text\":\"文档\",\"link\":\"/guide/\",\"activeMatch\":\"/guide/\"},{\"text\":\"Editor API\",\"link\":\"/api/editor/props\",\"activeMatch\":\"/api/\"},{\"text\":\"Runtime API\",\"link\":\"/runtime-api/core/app\",\"activeMatch\":\"/runtime-api/\"},{\"text\":\"表单配置\",\"link\":\"/form-config/fields/text\",\"activeMatch\":\"/form-config/\"},{\"text\":\"更新日志\",\"link\":\"https://github.com/Tencent/tmagic-editor/releases\"},{\"text\":\"Playground\",\"link\":\"https://tencent.github.io/tmagic-editor/playground/index.html\"}],\"sidebar\":{\"/guide/\":[{\"text\":\"文档\",\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/introduction.md\"},{\"text\":\"快速开始\",\"link\":\"/guide/\"},{\"text\":\"RUNTIME\",\"link\":\"/guide/runtime.md\"},{\"text\":\"组件开发\",\"link\":\"/guide/component.md\"},{\"text\":\"基础概念\",\"link\":\"/guide/conception.md\"},{\"text\":\"页面发布\",\"link\":\"/guide/publish.md\"},{\"text\":\"编辑器扩展\",\"link\":\"/guide/editor-expand.md\"},{\"text\":\"升级到1.5.x\",\"link\":\"/guide/migration.md\"}]},{\"text\":\"进阶指南\",\"items\":[{\"text\":\"JS Schema\",\"link\":\"/guide/advanced/js-schema.md\"},{\"text\":\"布局原理\",\"link\":\"/guide/advanced/layout.md\"},{\"text\":\"页面渲染\",\"link\":\"/guide/advanced/page.md\"},{\"text\":\"联动原理\",\"link\":\"/guide/advanced/coupling.md\"},{\"text\":\"代码块\",\"link\":\"/guide/advanced/code-block.md\"},{\"text\":\"数据源\",\"link\":\"/guide/advanced/data-source.md\"},{\"text\":\"历史记录面板\",\"link\":\"/guide/advanced/history-list.md\"},{\"text\":\"@tmagic/form\",\"link\":\"/guide/advanced/tmagic-form.md\"}]},{\"text\":\"教程\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/guide/tutorial/\"},{\"text\":\"1.Hello World\",\"link\":\"/guide/tutorial/hello-world.md\"},{\"text\":\"2.Runtime\",\"link\":\"/guide/tutorial/runtime.md\"},{\"text\":\"3.DSL解析渲染\",\"link\":\"/guide/tutorial/render.md\"}]}],\"/api/\":[{\"text\":\"编辑器\",\"items\":[{\"text\":\"Editor组件\",\"items\":[{\"text\":\"props\",\"link\":\"/api/editor/props.md\"},{\"text\":\"slots\",\"link\":\"/api/editor/slots.md\"},{\"text\":\"events\",\"link\":\"/api/editor/events.md\"}]},{\"text\":\"editorService\",\"items\":[{\"text\":\"方法\",\"link\":\"/api/editor/editorServiceMethods.md\"},{\"text\":\"事件\",\"link\":\"/api/editor/editorServiceEvents.md\"}]},{\"text\":\"propsService\",\"items\":[{\"text\":\"方法\",\"link\":\"/api/editor/propsServiceMethods.md\"},{\"text\":\"事件\",\"link\":\"/api/editor/propsServiceEvents.md\"}]},{\"text\":\"historyService\",\"items\":[{\"text\":\"方法\",\"link\":\"/api/editor/historyServiceMethods.md\"},{\"text\":\"事件\",\"link\":\"/api/editor/historyServiceEvents.md\"}]},{\"text\":\"eventsService\",\"link\":\"/api/editor/eventsServiceMethods.md\"},{\"text\":\"uiService\",\"link\":\"/api/editor/uiServiceMethods.md\"},{\"text\":\"codeBlockService\",\"link\":\"/api/editor/codeBlockServiceMethods.md\"},{\"text\":\"componentListService\",\"link\":\"/api/editor/componentListServiceMethods.md\"},{\"text\":\"storageService\",\"link\":\"/api/editor/storageServiceMethods.md\"}]},{\"text\":\"表单\",\"items\":[{\"text\":\"Form组件\",\"items\":[{\"text\":\"props\",\"link\":\"/api/form/form-props\"},{\"text\":\"methods\",\"link\":\"/api/form/form-methods\"},{\"text\":\"events\",\"link\":\"/api/form/form-events\"}]},{\"text\":\"FormDialog组件\",\"items\":[{\"text\":\"props\",\"link\":\"/api/form/form-dialog-props\"},{\"text\":\"methods\",\"link\":\"/api/form/form-dialog-methods\"},{\"text\":\"events\",\"link\":\"/api/form/form-dialog-events\"}]},{\"text\":\"工具函数\",\"items\":[{\"text\":\"submitForm\",\"link\":\"/api/form/submit-form\"}]}]},{\"text\":\"表格\",\"items\":[{\"text\":\"Table组件\",\"items\":[{\"text\":\"props\",\"link\":\"/api/table/props\"},{\"text\":\"methods\",\"link\":\"/api/table/methods\"},{\"text\":\"events\",\"link\":\"/api/table/events\"}]}]},{\"text\":\"stage\",\"items\":[{\"text\":\"StageCore\",\"items\":[{\"text\":\"方法\",\"link\":\"/api/stage/coreMethods\"},{\"text\":\"事件\",\"link\":\"/api/stage/coreEvents\"}]}]}],\"/form-config/\":[{\"text\":\"基础配置\",\"items\":[{\"text\":\"Input输入框\",\"link\":\"/form-config/fields/text.md\"},{\"text\":\"Textarea文本域\",\"link\":\"/form-config/fields/textarea.md\"},{\"text\":\"InputNumber计数器\",\"link\":\"/form-config/fields/number.md\"},{\"text\":\"NumberRange数字范围\",\"link\":\"/form-config/fields/number-range.md\"},{\"text\":\"Display只读文本\",\"link\":\"/form-config/fields/display.md\"},{\"text\":\"Hidden隐藏域\",\"link\":\"/form-config/fields/hidden.md\"},{\"text\":\"Link链接\",\"link\":\"/form-config/fields/link.md\"},{\"text\":\"Checkbox多选框\",\"link\":\"/form-config/fields/checkbox.md\"},{\"text\":\"Radio单选框\",\"link\":\"/form-config/fields/radio.md\"},{\"text\":\"Switch开关\",\"link\":\"/form-config/fields/switch.md\"},{\"text\":\"Select选择器\",\"link\":\"/form-config/fields/select.md\"},{\"text\":\"Cascader级联选择器\",\"link\":\"/form-config/fields/cascader.md\"},{\"text\":\"ColorPicker颜色选择器\",\"link\":\"/form-config/fields/color-picker.md\"},{\"text\":\"DatePick日期选择器\",\"link\":\"/form-config/fields/date-picker.md\"},{\"text\":\"DateRangePick日期范围选择器\",\"link\":\"/form-config/fields/daterange-picker.md\"},{\"text\":\"DatetimePick日期时间选择器\",\"link\":\"/form-config/fields/datetime-picker.md\"},{\"text\":\"TimePick时间选择器\",\"link\":\"/form-config/fields/time-picker.md\"},{\"text\":\"TimeRangePick时间范围选择器\",\"link\":\"/form-config/fields/timerange-picker.md\"},{\"text\":\"DynamicField动态表单\",\"link\":\"/form-config/fields/dynamic-field.md\"}]},{\"text\":\"编辑器中可用配置\",\"items\":[{\"text\":\"Code代码编辑器\",\"link\":\"/form-config/editor-fields/code.md\"},{\"text\":\"CodeLink代码链接\",\"link\":\"/form-config/editor-fields/code-link.md\"},{\"text\":\"CodeSelect代码块选择器\",\"link\":\"/form-config/editor-fields/code-select.md\"},{\"text\":\"CodeSelectCol代码块选择列\",\"link\":\"/form-config/editor-fields/code-select-col.md\"},{\"text\":\"DataSourceSelect数据源选择器\",\"link\":\"/form-config/editor-fields/data-source-select.md\"},{\"text\":\"DataSourceFieldSelect数据源字段选择器\",\"link\":\"/form-config/editor-fields/data-source-field-select.md\"},{\"text\":\"DataSourceMethodSelect数据源方法选择器\",\"link\":\"/form-config/editor-fields/data-source-method-select.md\"},{\"text\":\"DataSourceFields数据源字段配置\",\"link\":\"/form-config/editor-fields/data-source-fields.md\"},{\"text\":\"DataSourceInput数据源输入框\",\"link\":\"/form-config/editor-fields/data-source-input.md\"},{\"text\":\"DataSourceMethods数据源方法配置\",\"link\":\"/form-config/editor-fields/data-source-methods.md\"},{\"text\":\"DataSourceMocks数据源Mock配置\",\"link\":\"/form-config/editor-fields/data-source-mocks.md\"},{\"text\":\"UISelect组件选择器\",\"link\":\"/form-config/editor-fields/ui-select.md\"},{\"text\":\"KeyValue键值对\",\"link\":\"/form-config/editor-fields/key-value.md\"},{\"text\":\"PageFragmentSelect页面片选择器\",\"link\":\"/form-config/editor-fields/page-fragment-select.md\"},{\"text\":\"EventSelect事件选择器\",\"link\":\"/form-config/editor-fields/event-select.md\"},{\"text\":\"DisplayConds显示条件配置\",\"link\":\"/form-config/editor-fields/display-conds.md\"},{\"text\":\"CondOpSelect条件操作选择器\",\"link\":\"/form-config/editor-fields/cond-op-select.md\"}]},{\"text\":\"布局配置\",\"items\":[{\"text\":\"布局\",\"link\":\"/form-config/layout.md\"}]},{\"text\":\"联动配置\",\"items\":[{\"text\":\"联动\",\"link\":\"/form-config/relate.md\"}]},{\"text\":\"表单对比\",\"items\":[{\"text\":\"表单对比\",\"link\":\"/form-config/compare.md\"}]}],\"/runtime-api/\":[{\"text\":\"@tmagic/core\",\"items\":[{\"text\":\"App\",\"link\":\"/runtime-api/core/app\"},{\"text\":\"Node\",\"link\":\"/runtime-api/core/node\"},{\"text\":\"Page\",\"link\":\"/runtime-api/core/page\"},{\"text\":\"EventHelper\",\"link\":\"/runtime-api/core/eventHelper\"},{\"text\":\"Env\",\"link\":\"/runtime-api/core/env\"},{\"text\":\"IteratorContainer\",\"link\":\"/runtime-api/core/iteratorContainer\"},{\"text\":\"FlowState\",\"link\":\"/runtime-api/core/flowState\"},{\"text\":\"DevtoolApi\",\"link\":\"/runtime-api/core/devtoolApi\"},{\"text\":\"工具函数\",\"link\":\"/runtime-api/core/utils\"}]},{\"text\":\"@tmagic/data-source\",\"items\":[{\"text\":\"DataSourceManager\",\"link\":\"/runtime-api/data-source/dataSourceManager\"},{\"text\":\"DataSource\",\"link\":\"/runtime-api/data-source/dataSource\"},{\"text\":\"HttpDataSource\",\"link\":\"/runtime-api/data-source/httpDataSource\"},{\"text\":\"观察者数据类\",\"link\":\"/runtime-api/data-source/observedData\"},{\"text\":\"工具函数\",\"link\":\"/runtime-api/data-source/utils\"}]}]}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false,\"additionalConfig\":{}}");</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink