@alicloud/console-components
Version:
Alibaba Cloud React Components
43 lines (42 loc) • 2.36 kB
JavaScript
/**
* title: "超长翻页/下拉形态（以小号 32px 尺寸为例）"
* description: ""
*/
import React from 'react';
import { Tab } from '@alicloud/console-components';
var tabs = [
{ tab: '当前选项', key: '1' },
{ tab: '可选选项', key: '2' },
{ tab: '可选选项', key: '3' },
{ tab: '可选选项', key: '4' },
{ tab: '可选选项', key: '5' },
{ tab: '可选选项', key: '6' },
{ tab: '可选选项', key: '7' },
{ tab: '可选选项', key: '8' },
{ tab: '可选选项', key: '9' },
{ tab: '可选选项', key: '10' },
{ tab: '可选选项', key: '11' },
{ tab: '可选选项', key: '12' },
{ tab: '可选选项', key: '13' },
{ tab: '可选选项', key: '14' },
{ tab: '可选选项', key: '15' },
{ tab: '可选选项', key: '16' },
{ tab: '可选选项', key: '17' },
{ tab: '可选选项', key: '18' },
];
export default (function () {
return (React.createElement(React.Fragment, null,
React.createElement("div", null,
React.createElement("h4", null, "\u9875\u7B7E\u9009\u9879\u5361 - \u5DE6\u53F3\u7FFB\u9875"),
React.createElement(Tab, { shape: "wrapped", size: "small" }, tabs.map(function (tab) { return (React.createElement(Tab.Item, { title: tab.tab, key: tab.key })); })),
React.createElement("br", null),
React.createElement("h4", null, "\u9875\u7B7E\u9009\u9879\u5361 - \u4E0B\u62C9\u9009\u62E9"),
React.createElement(Tab, { shape: "wrapped", size: "small", excessMode: 'dropdown' }, tabs.map(function (tab) { return (React.createElement(Tab.Item, { title: tab.tab, key: tab.key })); }))),
React.createElement("br", null),
React.createElement("div", null,
React.createElement("h4", null, "\u7EBF\u6027\u9009\u9879\u5361 - \u5DE6\u53F3\u7FFB\u9875"),
React.createElement(Tab, { size: "small" }, tabs.map(function (tab) { return (React.createElement(Tab.Item, { title: tab.tab, key: tab.key })); })),
React.createElement("br", null),
React.createElement("h4", null, "\u7EBF\u6027\u9009\u9879\u5361 - \u4E0B\u62C9\u9009\u62E9"),
React.createElement(Tab, { size: "small", excessMode: 'dropdown' }, tabs.map(function (tab) { return (React.createElement(Tab.Item, { title: tab.tab, key: tab.key })); })))));
});