tmagic-editor/docs/assets/api_table_props.md._WrWithq.js

import{ax as i,z as a,A as n,b2 as l}from"./chunks/framework.DkLJC2NO.js";const g=JSON.parse('{"title":"Table组件 props","description":"","frontmatter":{},"headers":[],"relativePath":"api/table/props.md","filePath":"api/table/props.md"}'),t={name:"api/table/props.md"};function e(p,s,h,r,o,k){return n(),a("div",null,[...s[0]||(s[0]=[l(`<h1 id="table组件-props" tabindex="-1">Table组件 props <a class="header-anchor" href="#table组件-props" aria-label="Permalink to &quot;Table组件 props&quot;">​</a></h1><h2 id="data" tabindex="-1">data <a class="header-anchor" href="#data" aria-label="Permalink to &quot;data&quot;">​</a></h2><ul><li><p><strong>详情：</strong> 表格数据，数组格式</p></li><li><p><strong>默认值：</strong> <code>[]</code></p></li><li><p><strong>类型：</strong> <code>Array&lt;any&gt;</code></p></li><li><p><strong>示例：</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">[</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  { id: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, name: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;张三&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, age: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">20</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  { id: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, name: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;李四&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, age: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">25</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></li></ul><h2 id="columns" tabindex="-1">columns <a class="header-anchor" href="#columns" aria-label="Permalink to &quot;columns&quot;">​</a></h2><ul><li><p><strong>详情：</strong> 表格列配置</p></li><li><p><strong>默认值：</strong> <code>[]</code></p></li><li><p><strong>类型：</strong> <code>Array&lt;ColumnConfig&gt;</code></p></li><li><p><strong>示例：</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">[</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  { prop: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;name&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, label: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;姓名&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, width: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">120</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  { prop: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;age&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, label: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;年龄&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, width: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">80</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></li></ul><h2 id="spanmethod" tabindex="-1">spanMethod <a class="header-anchor" href="#spanmethod" aria-label="Permalink to &quot;spanMethod&quot;">​</a></h2><ul><li><p><strong>详情：</strong> 合并行或列的计算方法</p></li><li><p><strong>默认值：</strong> <code>undefined</code></p></li><li><p><strong>类型：</strong> <code>Function</code></p></li><li><p><strong>参数：</strong></p><ul><li><code>{ row, column, rowIndex, columnIndex }</code></li></ul></li><li><p><strong>返回值：</strong> <code>[rowspan, colspan]</code> 或 <code>{ rowspan, colspan }</code></p></li><li><p><strong>示例：</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({ </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">rowIndex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">columnIndex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (rowIndex </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">%</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> 2</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> ===</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">    if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (columnIndex </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">===</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">2</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;">else</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (columnIndex </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">===</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> 1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">0</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>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div></li></ul><h2 id="loading" tabindex="-1">loading <a class="header-anchor" href="#loading" aria-label="Permalink to &quot;loading&quot;">​</a></h2><ul><li><p><strong>详情：</strong> 是否显示加载状态</p></li><li><p><strong>默认值：</strong> <code>false</code></p></li><li><p><strong>类型：</strong> <code>boolean</code></p></li></ul><h2 id="showheader" tabindex="-1">showHeader <a class="header-anchor" href="#showheader" aria-label="Permalink to &quot;showHeader&quot;">​</a></h2><ul><li><p><strong>详情：</strong> 是否显示表头</p></li><li><p><strong>默认值：</strong> <code>true</code></p></li><li><p><strong>类型：</strong> <code>boolean</code></p></li></ul><h2 id="bodyheight" tabindex="-1">bodyHeight <a class="header-anchor" href="#bodyheight" aria-label="Permalink to &quot;bodyHeight&quot;">​</a></h2><ul><li><p><strong>详情：</strong> Table 的最大高度。合法的值为数字或者单位为 px 的高度</p></li><li><p><strong>默认值：</strong> <code>undefined</code></p></li><li><p><strong>类型：</strong> <code>string | number</code></p></li><li><p><strong>示例：</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">bodyHeight</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">400</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">bodyHeight</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;400px&#39;</span></span></code></pre></div></li></ul><h2 id="emptytext" tabindex="-1">emptyText <a class="header-anchor" href="#emptytext" aria-label="Permalink to &quot;emptyText&quot;">​</a></h2><ul><li><p><strong>详情：</strong> 空数据时显示的文本内容</p></li><li><p><strong>默认值：</strong> <code>&#39;暂无数据&#39;</code></p></li><li><p><strong>类型：</strong> <code>string</code></p></li></ul><h2 id="defaultexpandall" tabindex="-1">defaultExpandAll <a class="header-anchor" href="#defaultexpandall" aria-label="Permalink to &quot;defaultExpandAll&quot;">​</a></h2><ul><li><p><strong>详情：</strong> 是否默认展开所有行，当 Table 包含展开行存在或者为树形表格时有效</p></li><li><p><strong>默认值：</strong> <code>false</code></p></li><li><p><strong>类型：</strong> <code>boolean</code></p></li></ul><h2 id="rowkeyname" tabindex="-1">rowkeyName <a class="header-anchor" href="#rowkeyname" aria-label="Permalink to &quot;rowkeyName&quot;">​</a></h2><ul><li><p><strong>详情：</strong> 行数据的 Key，用来优化 Table 的渲染</p></li><li><p><strong>默认值：</strong> <code>&#39;id&#39;</code></p></li><li><p><strong>类型：</strong> <code>string</code></p></li><li><p><strong>说明：</strong> 在使用 reserve-selection 功能与显示树形数据时，该属性是必填的</p></li></ul><h2 id="border" tabindex="-1">border <a class="header-anchor" href="#border" aria-label="Permalink to &quot;border&quot;">​</a></h2><ul><li><p><strong>详情：</strong> 是否显示边框</p></li><li><p><strong>默认值：</strong> <code>false</code></p></li><li><p><strong>类型：</strong> <code>boolean</code></p></li></ul>`,21)])])}const E=i(t,[["render",e]]);export{g as __pageData,E as default};