@orca-fe/antd-plus
Version:
Transformer Container
69 lines • 1.95 kB
JavaScript
/**
* title: 标签自身的操作
*/
import React, { useContext, useEffect } from 'react';
import { TabsLayout } from "../..";
import { Button, Space } from 'antd';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var Content = () => {
var currentTab = useContext(TabsLayout.TabConfigContext);
return /*#__PURE__*/_jsxs("div", {
children: [/*#__PURE__*/_jsx("div", {
children: `${currentTab.params.text}`
}), /*#__PURE__*/_jsxs("div", {
children: ["\u5F53\u524D\u9875\u7B7E\uFF1A", `${currentTab.isActive ? '已激活' : '未激活'}`]
}), /*#__PURE__*/_jsxs(Space, {
children: [/*#__PURE__*/_jsx(Button, {
onClick: () => {
currentTab.close();
},
children: "\u5173\u95ED\u5F53\u524D\u6807\u7B7E"
}), /*#__PURE__*/_jsx(Button, {
onClick: () => {
setTimeout(() => {
currentTab.active();
}, 2000);
},
children: "\u6FC0\u6D3B\u5F53\u524D\u9875\u7B7E\uFF082\u79D2\u540E\uFF09"
})]
})]
});
};
var Demo = () => {
var tab = useContext(TabsLayout.TabsLayoutContext);
useEffect(() => {
// 添加几个页签
tab.add({
key: 'tab1',
title: 'Tab 1',
params: {
text: 'hello world'
},
content: /*#__PURE__*/_jsx(Content, {})
});
tab.add({
key: 'tab2',
title: 'Tab 2',
params: {
text: 'good day'
},
content: /*#__PURE__*/_jsx(Content, {})
});
tab.add({
key: 'tab3',
title: 'Tab 3',
params: {
text: 'bye bye'
},
content: /*#__PURE__*/_jsx(Content, {})
});
}, []);
return null;
};
export default (() => /*#__PURE__*/_jsxs(TabsLayout, {
emptyContent: /*#__PURE__*/_jsx("div", {
children: "\u5F53\u524D\u65E0\u9875\u7B7E"
}),
children: [/*#__PURE__*/_jsx(Demo, {}), /*#__PURE__*/_jsx(TabsLayout.View, {})]
}));