mirror of
https://github.com/wahyd4/ant-design.git
synced 2026-08-22 19:28:47 +10:00
51 lines
2.4 KiB
HTML
51 lines
2.4 KiB
HTML
<div class="code-box">
|
|
<div class="code-box-demo">
|
|
<div id="components-tabs-demo-basic"></div>
|
|
<script>(function(){"use strict";
|
|
|
|
var Tabs = antd.Tabs;
|
|
var TabPane = Tabs.TabPane;
|
|
|
|
function callback(key) {
|
|
console.log(key);
|
|
}
|
|
|
|
React.render(React.createElement(
|
|
Tabs,
|
|
{ defaultActiveKey: "2", onChange: callback },
|
|
React.createElement(
|
|
TabPane,
|
|
{ tab: "tab 1", key: "1" },
|
|
"选项卡一"
|
|
),
|
|
React.createElement(
|
|
TabPane,
|
|
{ tab: "tab 2", key: "2" },
|
|
"选项卡二"
|
|
),
|
|
React.createElement(
|
|
TabPane,
|
|
{ tab: "tab 3", key: "3" },
|
|
"选项卡三"
|
|
)
|
|
), document.getElementById('components-tabs-demo-basic'));})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Tabs = antd.Tabs;
|
|
<span class="keyword">var</span> TabPane = Tabs.TabPane;
|
|
|
|
<span class="function"><span class="keyword">function</span> <span class="title">callback</span><span class="params">(key)</span> {</span>
|
|
console.log(key);
|
|
}
|
|
|
|
React.render(
|
|
<span class="xml"><span class="tag"><<span class="title">Tabs</span> <span class="attribute">defaultActiveKey</span>=<span class="value">"2"</span> <span class="attribute">onChange</span>=<span class="value">{callback}</span>></span>
|
|
<span class="tag"><<span class="title">TabPane</span> <span class="attribute">tab</span>=<span class="value">"tab 1"</span> <span class="attribute">key</span>=<span class="value">"1"</span>></span>选项卡一<span class="tag"></<span class="title">TabPane</span>></span>
|
|
<span class="tag"><<span class="title">TabPane</span> <span class="attribute">tab</span>=<span class="value">"tab 2"</span> <span class="attribute">key</span>=<span class="value">"2"</span>></span>选项卡二<span class="tag"></<span class="title">TabPane</span>></span>
|
|
<span class="tag"><<span class="title">TabPane</span> <span class="attribute">tab</span>=<span class="value">"tab 3"</span> <span class="attribute">key</span>=<span class="value">"3"</span>></span>选项卡三<span class="tag"></<span class="title">TabPane</span>></span>
|
|
<span class="tag"></<span class="title">Tabs</span>></span>
|
|
, document.getElementById('components-tabs-demo-basic'));</span></code></pre></div>
|
|
</div>
|
|
<div class="code-box-meta markdown">
|
|
<div class="code-box-title">基本</div>
|
|
<p>默认选中第二项。</p>
|
|
<span class="collapse anticon anticon-circle-o-right"></span>
|
|
</div>
|
|
</div> |