amis/gh-pages/docs/components/table_f351105.js
2020-07-30 20:22:13 +08:00

122 lines
48 KiB
JavaScript

amis.define('docs/components/table.md', function(require, exports, module, define) {
module.exports = {
"title": "Table 表格",
"description": null,
"type": 0,
"group": "⚙ 组件",
"menuName": "Table 表格",
"icon": null,
"order": 67,
"html": "<p>表格展示,不支持配置初始化接口初始化数据域,所以需要搭配类似像<code>Service</code>这样的,具有配置接口初始化数据域功能的组件,或者手动进行数据域初始化,然后通过<code>source</code>属性,获取数据链中的数据,完成数据展示。</p>\n<h2><a class=\"anchor\" name=\"%E5%9F%BA%E6%9C%AC%E7%94%A8%E6%B3%95\" href=\"#%E5%9F%BA%E6%9C%AC%E7%94%A8%E6%B3%95\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>基本用法</h2><div class=\"amis-preview\" style=\"height: 900px\"><script type=\"text/schema\" height=\"900\" scope=\"body\">{\n \"type\": \"service\",\n \"api\": \"https://houtai.baidu.com/api/sample?perPage=5\",\n \"body\": [\n {\n \"type\": \"table\",\n \"title\": \"表格1\",\n \"source\": \"$rows\",\n \"columns\": [\n {\n \"name\": \"engine\",\n \"label\": \"Engine\"\n },\n\n {\n \"name\": \"version\",\n \"label\": \"Version\"\n }\n ]\n },\n\n {\n \"type\": \"table\",\n \"source\": \"$rows\",\n \"columns\": [\n {\n \"name\": \"engine\",\n \"label\": \"Engine\"\n },\n\n {\n \"name\": \"version\",\n \"label\": \"Version\"\n }\n ]\n }\n ]\n}\n</script></div>\n<h2><a class=\"anchor\" name=\"%E5%88%97%E9%85%8D%E7%BD%AE\" href=\"#%E5%88%97%E9%85%8D%E7%BD%AE\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>列配置</h2><p><code>columns</code>内,除了简单的配置<code>label</code>和<code>name</code>展示数据以外,还支持一些额外的配置项,可以帮助更好的展示数据。</p>\n<h3><a class=\"anchor\" name=\"%E5%88%97%E7%B1%BB%E5%9E%8B\" href=\"#%E5%88%97%E7%B1%BB%E5%9E%8B\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>列类型</h3><p>除了简单展示数据源所返回的数据以外,<code>list</code>的列支持除表单项以外所有组件类型,例如:</p>\n<div class=\"amis-preview\" style=\"height: 800px\"><script type=\"text/schema\" height=\"800\">{\n \"$schema\": \"https://houtai.baidu.com/v2/schemas/table.json#\",\n \"type\": \"table\",\n \"data\": {\n \"items\": [\n {\n \"id\": \"91264\",\n \"text\": \"衡 阎\",\n \"progress\": 22,\n \"type\": 4,\n \"boolean\": true,\n \"list\": [\n {\n \"title\": \"Forward Functionality Technician\",\n \"description\": \"nisi ex eum\"\n },\n {\n \"title\": \"District Applications Specialist\",\n \"description\": \"ipsam ratione voluptas\"\n },\n {\n \"title\": \"Future Operations Manager\",\n \"description\": \"ducimus fugit debitis\"\n },\n {\n \"title\": \"Dynamic Solutions Associate\",\n \"description\": \"saepe consequatur aut\"\n }\n ],\n \"audio\": \"https://news-bos.cdn.bcebos.com/mvideo/%E7%9A%87%E5%90%8E%E5%A4%A7%E9%81%93%E4%B8%9C.aac\",\n \"carousel\": [\n {\n \"image\": \"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg\"\n },\n {\n \"html\": \"<div style=\\\"width: 100%; height: 200px; background: #e3e3e3; text-align: center; line-height: 200px;\\\">carousel data in crud</div>\"\n },\n {\n \"image\": \"https://video-react.js.org/assets/poster.png\"\n }\n ],\n \"date\": 1591270438,\n \"image\": \"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg\",\n \"json\": {\n \"id\": 1,\n \"text\": \"text\"\n }\n },\n {\n \"id\": \"34202\",\n \"text\": \"吉 卢汉市\",\n \"progress\": 85,\n \"type\": 1,\n \"boolean\": true,\n \"list\": [\n {\n \"title\": \"Dynamic Assurance Orchestrator\",\n \"description\": \"ea ullam voluptates\"\n },\n {\n \"title\": \"Internal Division Assistant\",\n \"description\": \"illum deleniti qui\"\n },\n {\n \"title\": \"International Usability Administrator\",\n \"description\": \"sit voluptatem quia\"\n },\n {\n \"title\": \"Lead Optimization Orchestrator\",\n \"description\": \"autem et blanditiis\"\n },\n {\n \"title\": \"Future Division Assistant\",\n \"description\": \"dolor cupiditate sint\"\n },\n {\n \"title\": \"Forward Program Orchestrator\",\n \"description\": \"quia distinctio voluptas\"\n },\n {\n \"title\": \"Human Implementation Technician\",\n \"description\": \"consequatur quaerat ullam\"\n },\n {\n \"title\": \"National Identity Administrator\",\n \"description\": \"ipsa et reiciendis\"\n },\n {\n \"title\": \"Regional Factors Planner\",\n \"description\": \"sed deserunt natus\"\n },\n {\n \"title\": \"Human Data Administrator\",\n \"description\": \"rerum consequatur odit\"\n }\n ],\n \"audio\": \"https://news-bos.cdn.bcebos.com/mvideo/%E7%9A%87%E5%90%8E%E5%A4%A7%E9%81%93%E4%B8%9C.aac\",\n \"carousel\": [\n {\n \"image\": \"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg\"\n },\n {\n \"html\": \"<div style=\\\"width: 100%; height: 200px; background: #e3e3e3; text-align: center; line-height: 200px;\\\">carousel data in crud</div>\"\n },\n {\n \"image\": \"https://video-react.js.org/assets/poster.png\"\n }\n ],\n \"date\": 1591270438,\n \"image\": \"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg\",\n \"json\": {\n \"id\": 1,\n \"text\": \"text\"\n }\n },\n {\n \"id\": \"37701\",\n \"text\": \"立辉安市\",\n \"progress\": 72,\n \"type\": 2,\n \"boolean\": false,\n \"list\": [\n {\n \"title\": \"Corporate Metrics Liason\",\n \"description\": \"aspernatur natus qui\"\n },\n {\n \"title\": \"Central Paradigm Analyst\",\n \"description\": \"sequi numquam ad\"\n },\n {\n \"title\": \"International Data Administrator\",\n \"description\": \"sed libero eum\"\n },\n {\n \"title\": \"Forward Optimization Assistant\",\n \"description\": \"officiis accusantium dolorem\"\n },\n {\n \"title\": \"Senior Metrics Executive\",\n \"description\": \"commodi sint quod\"\n },\n {\n \"title\": \"Corporate Quality Facilitator\",\n \"description\": \"aut aperiam est\"\n },\n {\n \"title\": \"Forward Operations Producer\",\n \"description\": \"sed corporis eaque\"\n },\n {\n \"title\": \"National Integration Analyst\",\n \"description\": \"quasi ab cumque\"\n }\n ],\n \"audio\": \"https://news-bos.cdn.bcebos.com/mvideo/%E7%9A%87%E5%90%8E%E5%A4%A7%E9%81%93%E4%B8%9C.aac\",\n \"carousel\": [\n {\n \"image\": \"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg\"\n },\n {\n \"html\": \"<div style=\\\"width: 100%; height: 200px; background: #e3e3e3; text-align: center; line-height: 200px;\\\">carousel data in crud</div>\"\n },\n {\n \"image\": \"https://video-react.js.org/assets/poster.png\"\n }\n ],\n \"date\": 1591270438,\n \"image\": \"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg\",\n \"json\": {\n \"id\": 1,\n \"text\": \"text\"\n }\n }\n ]\n },\n \"affixHeader\": false,\n \"syncLocation\": false,\n \"columns\": [\n {\n \"name\": \"id\",\n \"label\": \"ID\",\n \"type\": \"text\"\n },\n {\n \"name\": \"text\",\n \"label\": \"文本\",\n \"type\": \"text\"\n },\n {\n \"type\": \"image\",\n \"label\": \"图片\",\n \"name\": \"image\"\n },\n {\n \"name\": \"date\",\n \"type\": \"date\",\n \"label\": \"日期\"\n },\n {\n \"name\": \"progress\",\n \"label\": \"进度\",\n \"type\": \"progress\"\n },\n {\n \"name\": \"boolean\",\n \"label\": \"状态\",\n \"type\": \"status\"\n },\n {\n \"name\": \"boolean\",\n \"label\": \"开关\",\n \"type\": \"switch\"\n },\n {\n \"name\": \"type\",\n \"label\": \"映射\",\n \"type\": \"mapping\",\n \"map\": {\n \"1\": \"<span class='label label-info'>漂亮</span>\",\n \"2\": \"<span class='label label-success'>开心</span>\",\n \"3\": \"<span class='label label-danger'>惊吓</span>\",\n \"4\": \"<span class='label label-warning'>紧张</span>\",\n \"*\": \"其他:${type}\"\n }\n },\n {\n \"name\": \"list\",\n \"type\": \"list\",\n \"label\": \"List\",\n \"placeholder\": \"-\",\n \"listItem\": {\n \"title\": \"${title}\",\n \"subTitle\": \"${description}\"\n }\n }\n ]\n}\n</script></div>\n<h3><a class=\"anchor\" name=\"%E5%88%97%E5%AE%BD\" href=\"#%E5%88%97%E5%AE%BD\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>列宽</h3><p>可以给列配置<code>width</code>属性,控制列宽,共有两种方式:</p>\n<h4><a class=\"anchor\" name=\"%E5%9B%BA%E5%AE%9A%E5%83%8F%E7%B4%A0\" href=\"#%E5%9B%BA%E5%AE%9A%E5%83%8F%E7%B4%A0\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>固定像素</h4><p>可以配置数字,用于设置列宽像素,例如下面例子我们给<code>Rendering engine</code>列宽设置为<code>100px</code>。</p>\n<div class=\"amis-preview\" style=\"height: 800px\"><script type=\"text/schema\" height=\"800\" scope=\"body\">{\n \"type\": \"crud\",\n \"api\": \"https://houtai.baidu.com/api/sample?waitSeconds=1\",\n \"columns\": [\n {\n \"name\": \"id\",\n \"label\": \"ID\"\n },\n {\n \"name\": \"engine\",\n \"label\": \"Rendering engine\",\n \"width\": 100\n }\n ]\n}\n</script></div>\n<h4><a class=\"anchor\" name=\"%E7%99%BE%E5%88%86%E6%AF%94\" href=\"#%E7%99%BE%E5%88%86%E6%AF%94\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>百分比</h4><p>也可以百分比来指定列宽,例如下面例子我们给<code>Rendering engine</code>列宽设置为<code>50%</code>。</p>\n<div class=\"amis-preview\" style=\"height: 800px\"><script type=\"text/schema\" height=\"800\" scope=\"body\">{\n \"type\": \"crud\",\n \"api\": \"https://houtai.baidu.com/api/sample?waitSeconds=1\",\n \"columns\": [\n {\n \"name\": \"id\",\n \"label\": \"ID\"\n },\n {\n \"name\": \"engine\",\n \"label\": \"Rendering engine\",\n \"width\": \"50%\"\n }\n ]\n}\n</script></div>\n<h3><a class=\"anchor\" name=\"%E9%BB%98%E8%AE%A4%E6%98%AF%E5%90%A6%E6%98%BE%E7%A4%BA\" href=\"#%E9%BB%98%E8%AE%A4%E6%98%AF%E5%90%A6%E6%98%BE%E7%A4%BA\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>默认是否显示</h3><p>默认 <code>columnsTogglable</code> 配置为 <code>auto</code>,当列超过 5 列后,就会在工具栏多渲染出来一个列展示与否的开关。你可以设置成 <code>true</code> 或者 <code>false</code> 来强制开或者关。在列配置中可以通过配置 <code>toggled</code> 为 <code>false</code> 默认不展示这列,比如下面这个栗子中 ID 这一栏。</p>\n<div class=\"amis-preview\" style=\"height: 800px\"><script type=\"text/schema\" height=\"800\" scope=\"body\">{\n \"type\": \"service\",\n \"api\": \"https://houtai.baidu.com/api/sample?perPage=5\",\n \"body\": [\n {\n \"type\": \"table\",\n \"source\": \"$rows\",\n \"className\": \"m-b-none\",\n \"columns\": [\n {\n \"name\": \"engine\",\n \"label\": \"Engine\"\n },\n\n {\n \"name\": \"grade\",\n \"label\": \"Grade\"\n },\n\n {\n \"name\": \"version\",\n \"label\": \"Version\"\n },\n\n {\n \"name\": \"browser\",\n \"label\": \"Browser\"\n },\n\n {\n \"name\": \"id\",\n \"label\": \"ID\",\n \"toggled\": false\n },\n\n {\n \"name\": \"platform\",\n \"label\": \"Platform\"\n }\n ]\n }\n ]\n}\n</script></div>\n<h3><a class=\"anchor\" name=\"%E5%8F%AF%E5%A4%8D%E5%88%B6\" href=\"#%E5%8F%AF%E5%A4%8D%E5%88%B6\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>可复制</h3><p>可以在列上配置<code>&quot;copyable&quot;: true</code>,会在该列的内容区里,渲染一个复制内容的图标,点击可复制该显示内容</p>\n<div class=\"amis-preview\" style=\"height: 800px\"><script type=\"text/schema\" height=\"800\" scope=\"body\">{\n \"type\": \"crud\",\n \"api\": \"https://houtai.baidu.com/api/sample?waitSeconds=1\",\n \"columns\": [\n {\n \"name\": \"id\",\n \"label\": \"ID\"\n },\n {\n \"name\": \"engine\",\n \"label\": \"Rendering engine\",\n \"copyable\": true\n }\n ]\n}\n</script></div>\n<p>你也可以配置对象形式,可以自定义显示内容</p>\n<div class=\"amis-preview\" style=\"height: 800px\"><script type=\"text/schema\" height=\"800\" scope=\"body\">{\n \"type\": \"crud\",\n \"api\": \"https://houtai.baidu.com/api/sample?waitSeconds=1\",\n \"columns\": [\n {\n \"name\": \"id\",\n \"label\": \"ID\"\n },\n {\n \"name\": \"engine\",\n \"label\": \"Rendering engine\",\n \"copyable\": {\n \"content\": \"复制的内容是:${engine}\"\n }\n }\n ]\n}\n</script></div>\n<h3><a class=\"anchor\" name=\"%E5%BC%B9%E5%87%BA%E6%A1%86\" href=\"#%E5%BC%B9%E5%87%BA%E6%A1%86\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>弹出框</h3><p>可以给列上配置<code>popover</code>属性,会在该列的内容区里,渲染一个图标,点击会显示弹出框,用于展示内容</p>\n<div class=\"amis-preview\" style=\"height: 800px\"><script type=\"text/schema\" height=\"800\" scope=\"body\">{\n \"type\": \"crud\",\n \"api\": \"https://houtai.baidu.com/api/sample?waitSeconds=1\",\n \"columns\": [\n {\n \"name\": \"id\",\n \"label\": \"ID\"\n },\n {\n \"name\": \"engine\",\n \"label\": \"Rendering engine\",\n \"popOver\": {\n \"body\": {\n \"type\": \"tpl\",\n \"tpl\": \"${engine}\"\n }\n }\n }\n ]\n}\n</script></div>\n<h3><a class=\"anchor\" name=\"%E8%A1%A8%E5%A4%B4%E6%A0%B7%E5%BC%8F\" href=\"#%E8%A1%A8%E5%A4%B4%E6%A0%B7%E5%BC%8F\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>表头样式</h3><p>可以配置<code>&quot;isHead&quot;: true</code>,来让当前列以表头的样式展示。应用场景是:</p>\n<ol>\n<li>所有列<code>label</code>配置空字符串,不显示表头</li>\n<li>配置<code>combineNum</code>,合并单元格,实现左侧表头的形式</li>\n<li>列上配置<code>&quot;isHead&quot;: true</code>,调整样式</li>\n</ol>\n<div class=\"amis-preview\" style=\"height: 800px\"><script type=\"text/schema\" height=\"800\" scope=\"body\">{\n \"type\": \"crud\",\n \"api\": \"https://houtai.baidu.com/api/sample?waitSeconds=1\",\n \"affixHeader\": false,\n \"combineNum\": 1,\n \"columns\": [\n {\n \"name\": \"engine\",\n \"label\": \"\",\n \"isHead\": true\n },\n {\n \"name\": \"browser\",\n \"label\": \"\"\n },\n {\n \"name\": \"platform\",\n \"label\": \"\"\n },\n {\n \"name\": \"version\",\n \"label\": \"\"\n },\n {\n \"name\": \"grade\",\n \"label\": \"\"\n }\n ]\n}\n</script></div>\n<p>还可以配置&quot;offset&quot;,实现弹出框位置调整自定义</p>\n<div class=\"amis-preview\" style=\"height: 800px\"><script type=\"text/schema\" height=\"800\" scope=\"body\">{\n \"type\": \"crud\",\n \"api\": \"https://houtai.baidu.com/api/sample?waitSeconds=1\",\n \"columns\": [\n {\n \"name\": \"id\",\n \"label\": \"ID\"\n },\n {\n \"name\": \"engine\",\n \"label\": \"Rendering engine\",\n \"popOver\": {\n \"body\": {\n \"type\": \"tpl\",\n \"tpl\": \"偏了一点的popover\"\n },\n \"offset\": {\n \"y\": 100\n }\n }\n }\n ]\n}\n</script></div>\n<h2><a class=\"anchor\" name=\"%E5%B5%8C%E5%A5%97\" href=\"#%E5%B5%8C%E5%A5%97\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>嵌套</h2><p>当行数据中存在 children 属性时,可以自动嵌套显示下去。</p>\n<div class=\"amis-preview\" style=\"height: 600px\"><script type=\"text/schema\" height=\"600\" scope=\"body\">{\n \"type\": \"service\",\n \"data\": {\n \"rows\": [\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 4.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"4\",\n \"grade\": \"X\",\n \"id\": 1,\n \"children\": [\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 4.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"4\",\n \"grade\": \"X\",\n \"id\": 1001\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 5.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"5\",\n \"grade\": \"C\",\n \"id\": 1002\n }\n ]\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 5.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"5\",\n \"grade\": \"C\",\n \"id\": 2,\n \"children\": [\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 4.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"4\",\n \"grade\": \"X\",\n \"id\": 2001\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 5.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"5\",\n \"grade\": \"C\",\n \"id\": 2002\n }\n ]\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 5.5\",\n \"platform\": \"Win 95+\",\n \"version\": \"5.5\",\n \"grade\": \"A\",\n \"id\": 3,\n \"children\": [\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 4.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"4\",\n \"grade\": \"X\",\n \"id\": 3001\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 5.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"5\",\n \"grade\": \"C\",\n \"id\": 3002\n }\n ]\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 6\",\n \"platform\": \"Win 98+\",\n \"version\": \"6\",\n \"grade\": \"A\",\n \"id\": 4,\n \"children\": [\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 4.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"4\",\n \"grade\": \"X\",\n \"id\": 4001\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 5.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"5\",\n \"grade\": \"C\",\n \"id\": 4002\n }\n ]\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 7\",\n \"platform\": \"Win XP SP2+\",\n \"version\": \"7\",\n \"grade\": \"A\",\n \"id\": 5,\n \"children\": [\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 4.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"4\",\n \"grade\": \"X\",\n \"id\": 5001\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 5.0\",\n \"platform\": \"Win 95+\",\n \"version\": \"5\",\n \"grade\": \"C\",\n \"id\": 5002\n }\n ]\n }\n ]\n },\n \"body\": [\n {\n \"type\": \"table\",\n \"source\": \"$rows\",\n \"className\": \"m-b-none\",\n \"columnsTogglable\": false,\n \"columns\": [\n {\n \"name\": \"engine\",\n \"label\": \"Engine\"\n },\n\n {\n \"name\": \"grade\",\n \"label\": \"Grade\"\n },\n\n {\n \"name\": \"version\",\n \"label\": \"Version\"\n },\n\n {\n \"name\": \"browser\",\n \"label\": \"Browser\"\n },\n\n {\n \"name\": \"id\",\n \"label\": \"ID\"\n },\n\n {\n \"name\": \"platform\",\n \"label\": \"Platform\"\n }\n ]\n }\n ]\n}\n</script></div>\n<h2><a class=\"anchor\" name=\"%E5%BA%95%E9%83%A8%E5%B1%95%E7%A4%BA-footable-\" href=\"#%E5%BA%95%E9%83%A8%E5%B1%95%E7%A4%BA-footable-\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>底部展示 (Footable)</h2><p>列太多时,内容没办法全部显示完,可以让部分信息在底部显示,可以让用户展开查看详情。配置很简单,只需要开启 <code>footable</code> 属性,同时将想在底部展示的列加个 <code>breakpoint</code> 属性为 <code>*</code> 即可。</p>\n<div class=\"amis-preview\" style=\"height: 600px\"><script type=\"text/schema\" height=\"600\" scope=\"body\">{\n \"type\": \"service\",\n \"api\": \"https://houtai.baidu.com/api/sample?perPage=5\",\n \"body\": [\n {\n \"type\": \"table\",\n \"source\": \"$rows\",\n \"className\": \"m-b-none\",\n \"columnsTogglable\": false,\n \"footable\": true,\n \"columns\": [\n {\n \"name\": \"engine\",\n \"label\": \"Engine\"\n },\n\n {\n \"name\": \"grade\",\n \"label\": \"Grade\"\n },\n\n {\n \"name\": \"version\",\n \"label\": \"Version\",\n \"breakpoint\": \"*\"\n },\n\n {\n \"name\": \"browser\",\n \"label\": \"Browser\",\n \"breakpoint\": \"*\"\n },\n\n {\n \"name\": \"id\",\n \"label\": \"ID\",\n \"breakpoint\": \"*\"\n },\n\n {\n \"name\": \"platform\",\n \"label\": \"Platform\",\n \"breakpoint\": \"*\"\n }\n ]\n }\n ]\n}\n</script></div>\n<p>默认都不会展开,如果你想默认展开第一个就把 footable 配置成这样。</p>\n<pre><code class=\"lang-json\"><span class=\"token punctuation\">{</span>\n <span class=\"token property\">\"footable\"</span><span class=\"token operator\">:</span> <span class=\"token punctuation\">{</span>\n <span class=\"token property\">\"expand\"</span><span class=\"token operator\">:</span> <span class=\"token string\">\"first\"</span>\n <span class=\"token punctuation\">}</span>\n<span class=\"token punctuation\">}</span>\n</code></pre>\n<p>当配置成 <code>all</code> 时表示全部展开。</p>\n<h2><a class=\"anchor\" name=\"%E5%90%88%E5%B9%B6%E5%8D%95%E5%85%83%E6%A0%BC\" href=\"#%E5%90%88%E5%B9%B6%E5%8D%95%E5%85%83%E6%A0%BC\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>合并单元格</h2><p>只需要配置 <code>combineNum</code> 属性即可,他表示从左到右多少列内启动自动合并单元格,只要多行的同一个属性值是一样的,就会自动合并。</p>\n<div class=\"amis-preview\" style=\"height: 700px\"><script type=\"text/schema\" height=\"700\" scope=\"body\">{\n \"type\": \"service\",\n \"data\": {\n \"rows\": [\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 4.2\",\n \"platform\": \"Win 95+\",\n \"version\": \"4\",\n \"grade\": \"A\"\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"Internet Explorer 4.2\",\n \"platform\": \"Win 95+\",\n \"version\": \"4\",\n \"grade\": \"B\"\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"AOL browser (AOL desktop)\",\n \"platform\": \"Win 95+\",\n \"version\": \"4\",\n \"grade\": \"C\"\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"AOL browser (AOL desktop)\",\n \"platform\": \"Win 98\",\n \"version\": \"3\",\n \"grade\": \"A\"\n },\n {\n \"engine\": \"Trident\",\n \"browser\": \"AOL browser (AOL desktop)\",\n \"platform\": \"Win 98\",\n \"version\": \"4\",\n \"grade\": \"A\"\n },\n {\n \"engine\": \"Gecko\",\n \"browser\": \"Firefox 1.0\",\n \"platform\": \"Win 98+ / OSX.2+\",\n \"version\": \"4\",\n \"grade\": \"A\"\n },\n {\n \"engine\": \"Gecko\",\n \"browser\": \"Firefox 1.0\",\n \"platform\": \"Win 98+ / OSX.2+\",\n \"version\": \"5\",\n \"grade\": \"A\"\n },\n {\n \"engine\": \"Gecko\",\n \"browser\": \"Firefox 2.0\",\n \"platform\": \"Win 98+ / OSX.2+\",\n \"version\": \"5\",\n \"grade\": \"B\"\n },\n {\n \"engine\": \"Gecko\",\n \"browser\": \"Firefox 2.0\",\n \"platform\": \"Win 98+ / OSX.2+\",\n \"version\": \"5\",\n \"grade\": \"C\"\n },\n {\n \"engine\": \"Gecko\",\n \"browser\": \"Firefox 2.0\",\n \"platform\": \"Win 98+ / OSX.2+\",\n \"version\": \"5\",\n \"grade\": \"D\"\n }\n ]\n },\n \"body\": [\n {\n \"type\": \"table\",\n \"source\": \"$rows\",\n \"className\": \"m-b-none\",\n \"combineNum\": 3,\n \"columnsTogglable\": false,\n \"columns\": [\n {\n \"name\": \"engine\",\n \"label\": \"Rendering engine\"\n },\n {\n \"name\": \"browser\",\n \"label\": \"Browser\"\n },\n {\n \"name\": \"platform\",\n \"label\": \"Platform(s)\"\n },\n {\n \"name\": \"version\",\n \"label\": \"Engine version\"\n },\n {\n \"name\": \"grade\",\n \"label\": \"CSS grade\"\n }\n ]\n }\n ]\n}\n</script></div>\n<h2><a class=\"anchor\" name=\"%E8%B6%85%E7%BA%A7%E8%A1%A8%E5%A4%B4\" href=\"#%E8%B6%85%E7%BA%A7%E8%A1%A8%E5%A4%B4\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>超级表头</h2><p>超级表头意思是,表头还可以再一次进行分组。额外添加个 <code>groupName</code> 属性即可。</p>\n<div class=\"amis-preview\" style=\"height: 630px\"><script type=\"text/schema\" height=\"630\" scope=\"body\">{\n \"type\": \"service\",\n \"api\": \"https://houtai.baidu.com/api/sample?perPage=5\",\n \"body\": [\n {\n \"type\": \"table\",\n \"source\": \"$rows\",\n \"className\": \"m-b-none\",\n \"columns\": [\n {\n \"name\": \"engine\",\n \"label\": \"Engine\",\n \"groupName\": \"分组1\"\n },\n\n {\n \"name\": \"grade\",\n \"label\": \"Grade\",\n \"groupName\": \"分组1\"\n },\n\n {\n \"name\": \"version\",\n \"label\": \"Version\",\n \"groupName\": \"分组2\"\n },\n\n {\n \"name\": \"browser\",\n \"label\": \"Browser\",\n \"groupName\": \"分组2\"\n },\n\n {\n \"name\": \"id\",\n \"label\": \"ID\",\n \"toggled\": false,\n \"groupName\": \"分组2\"\n },\n\n {\n \"name\": \"platform\",\n \"label\": \"Platform\",\n \"groupName\": \"分组2\"\n }\n ]\n }\n ]\n}\n</script></div>\n<h2><a class=\"anchor\" name=\"%E5%9B%BA%E5%AE%9A%E5%88%97\" href=\"#%E5%9B%BA%E5%AE%9A%E5%88%97\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>固定列</h2><p>列太多可以让重要的几列固定,可以配置固定在左侧还是右侧,只需要给需要固定的列上配置 <code>fixed</code> 属性,配置 <code>left</code> 或者 <code>right</code>。</p>\n<div class=\"amis-preview\" style=\"height: 730px\"><script type=\"text/schema\" height=\"730\" scope=\"body\">{\n \"type\": \"service\",\n \"api\": \"https://houtai.baidu.com/api/sample?perPage=5\",\n \"className\": \"w-xxl\",\n \"body\": [\n {\n \"type\": \"table\",\n \"source\": \"$rows\",\n \"className\": \"m-b-none\",\n \"columnsTogglable\": false,\n \"columns\": [\n {\n \"name\": \"engine\",\n \"label\": \"Engine\",\n \"fixed\": \"left\"\n },\n\n {\n \"name\": \"grade\",\n \"label\": \"Grade\"\n },\n\n {\n \"name\": \"version\",\n \"label\": \"Version\"\n },\n\n {\n \"name\": \"browser\",\n \"label\": \"Browser\"\n },\n\n {\n \"name\": \"id\",\n \"label\": \"ID\"\n },\n\n {\n \"name\": \"platform\",\n \"label\": \"Platform\",\n \"fixed\": \"right\"\n }\n ]\n }\n ]\n}\n</script></div>\n<h2><a class=\"anchor\" name=\"%E5%B1%9E%E6%80%A7%E8%A1%A8\" href=\"#%E5%B1%9E%E6%80%A7%E8%A1%A8\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>属性表</h2><table>\n<thead>\n<tr>\n<th>属性名</th>\n<th>类型</th>\n<th>默认值</th>\n<th>说明</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td><code>string</code></td>\n<td></td>\n<td><code>&quot;type&quot;</code> 指定为 table 渲染器</td>\n</tr>\n<tr>\n<td>title</td>\n<td><code>string</code></td>\n<td></td>\n<td>标题</td>\n</tr>\n<tr>\n<td>source</td>\n<td><code>string</code></td>\n<td><code>${items}</code></td>\n<td>数据源, 绑定当前环境变量</td>\n</tr>\n<tr>\n<td>affixHeader</td>\n<td><code>boolean</code></td>\n<td><code>true</code></td>\n<td>是否固定表头</td>\n</tr>\n<tr>\n<td>columnsTogglable</td>\n<td><code>auto</code> 或者 <code>boolean</code></td>\n<td><code>auto</code></td>\n<td>展示列显示开关, 自动即:列数量大于或等于 5 个时自动开启</td>\n</tr>\n<tr>\n<td>placeholder</td>\n<td>string</td>\n<td><code>暂无数据</code></td>\n<td>当没数据的时候的文字提示</td>\n</tr>\n<tr>\n<td>className</td>\n<td><code>string</code></td>\n<td><code>panel-default</code></td>\n<td>外层 CSS 类名</td>\n</tr>\n<tr>\n<td>tableClassName</td>\n<td><code>string</code></td>\n<td><code>table-db table-striped</code></td>\n<td>表格 CSS 类名</td>\n</tr>\n<tr>\n<td>headerClassName</td>\n<td><code>string</code></td>\n<td><code>Action.md-table-header</code></td>\n<td>顶部外层 CSS 类名</td>\n</tr>\n<tr>\n<td>footerClassName</td>\n<td><code>string</code></td>\n<td><code>Action.md-table-footer</code></td>\n<td>底部外层 CSS 类名</td>\n</tr>\n<tr>\n<td>toolbarClassName</td>\n<td><code>string</code></td>\n<td><code>Action.md-table-toolbar</code></td>\n<td>工具栏 CSS 类名</td>\n</tr>\n<tr>\n<td>columns</td>\n<td>Array&lt;<a href=\"#-e5-88-97-e9-85-8d-e7-bd-ae\">Column</a>&gt;</td>\n<td></td>\n<td>用来设置列信息</td>\n</tr>\n<tr>\n<td>combineNum</td>\n<td><code>number</code></td>\n<td></td>\n<td>自动合并单元格</td>\n</tr>\n</tbody>\n</table>\n",
"toc": {
"label": "目录",
"type": "toc",
"children": [
{
"label": "基本用法",
"fragment": "%E5%9F%BA%E6%9C%AC%E7%94%A8%E6%B3%95",
"fullPath": "#%E5%9F%BA%E6%9C%AC%E7%94%A8%E6%B3%95",
"level": 2
},
{
"label": "列配置",
"fragment": "%E5%88%97%E9%85%8D%E7%BD%AE",
"fullPath": "#%E5%88%97%E9%85%8D%E7%BD%AE",
"level": 2,
"children": [
{
"label": "列类型",
"fragment": "%E5%88%97%E7%B1%BB%E5%9E%8B",
"fullPath": "#%E5%88%97%E7%B1%BB%E5%9E%8B",
"level": 3
},
{
"label": "列宽",
"fragment": "%E5%88%97%E5%AE%BD",
"fullPath": "#%E5%88%97%E5%AE%BD",
"level": 3,
"children": [
{
"label": "固定像素",
"fragment": "%E5%9B%BA%E5%AE%9A%E5%83%8F%E7%B4%A0",
"fullPath": "#%E5%9B%BA%E5%AE%9A%E5%83%8F%E7%B4%A0",
"level": 4
},
{
"label": "百分比",
"fragment": "%E7%99%BE%E5%88%86%E6%AF%94",
"fullPath": "#%E7%99%BE%E5%88%86%E6%AF%94",
"level": 4
}
]
},
{
"label": "默认是否显示",
"fragment": "%E9%BB%98%E8%AE%A4%E6%98%AF%E5%90%A6%E6%98%BE%E7%A4%BA",
"fullPath": "#%E9%BB%98%E8%AE%A4%E6%98%AF%E5%90%A6%E6%98%BE%E7%A4%BA",
"level": 3
},
{
"label": "可复制",
"fragment": "%E5%8F%AF%E5%A4%8D%E5%88%B6",
"fullPath": "#%E5%8F%AF%E5%A4%8D%E5%88%B6",
"level": 3
},
{
"label": "弹出框",
"fragment": "%E5%BC%B9%E5%87%BA%E6%A1%86",
"fullPath": "#%E5%BC%B9%E5%87%BA%E6%A1%86",
"level": 3
},
{
"label": "表头样式",
"fragment": "%E8%A1%A8%E5%A4%B4%E6%A0%B7%E5%BC%8F",
"fullPath": "#%E8%A1%A8%E5%A4%B4%E6%A0%B7%E5%BC%8F",
"level": 3
}
]
},
{
"label": "嵌套",
"fragment": "%E5%B5%8C%E5%A5%97",
"fullPath": "#%E5%B5%8C%E5%A5%97",
"level": 2
},
{
"label": "底部展示 (Footable)",
"fragment": "%E5%BA%95%E9%83%A8%E5%B1%95%E7%A4%BA-footable-",
"fullPath": "#%E5%BA%95%E9%83%A8%E5%B1%95%E7%A4%BA-footable-",
"level": 2
},
{
"label": "合并单元格",
"fragment": "%E5%90%88%E5%B9%B6%E5%8D%95%E5%85%83%E6%A0%BC",
"fullPath": "#%E5%90%88%E5%B9%B6%E5%8D%95%E5%85%83%E6%A0%BC",
"level": 2
},
{
"label": "超级表头",
"fragment": "%E8%B6%85%E7%BA%A7%E8%A1%A8%E5%A4%B4",
"fullPath": "#%E8%B6%85%E7%BA%A7%E8%A1%A8%E5%A4%B4",
"level": 2
},
{
"label": "固定列",
"fragment": "%E5%9B%BA%E5%AE%9A%E5%88%97",
"fullPath": "#%E5%9B%BA%E5%AE%9A%E5%88%97",
"level": 2
},
{
"label": "属性表",
"fragment": "%E5%B1%9E%E6%80%A7%E8%A1%A8",
"fullPath": "#%E5%B1%9E%E6%80%A7%E8%A1%A8",
"level": 2
}
],
"level": 0
}
};
});