mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-30 12:28:33 +08:00
502dac12aa
* docs: fix code * feat: lint * feat: prettier * feat: test * feat: review * feat: format html * feat: format html
58 lines
1.5 KiB
TypeScript
58 lines
1.5 KiB
TypeScript
import React, { useState } from 'react';
|
|
import { Drawer, Modal, Space, Switch } from 'antd';
|
|
|
|
const App: React.FC = () => {
|
|
const [drawer, setDrawer] = useState(false);
|
|
const [drawer2, setDrawer2] = useState(false);
|
|
const [modal, setModal] = useState(false);
|
|
const [modal2, setModal2] = useState(false);
|
|
|
|
return (
|
|
<div style={{ position: 'relative', zIndex: 999999 }}>
|
|
<Space>
|
|
<Switch
|
|
checkedChildren="Drawer"
|
|
unCheckedChildren="Drawer"
|
|
checked={drawer}
|
|
onChange={() => setDrawer(!drawer)}
|
|
/>
|
|
<Switch
|
|
checkedChildren="Drawer2"
|
|
unCheckedChildren="Drawer2"
|
|
checked={drawer2}
|
|
onChange={() => setDrawer2(!drawer2)}
|
|
/>
|
|
<Switch
|
|
checkedChildren="Modal"
|
|
unCheckedChildren="Modal"
|
|
checked={modal}
|
|
onChange={() => setModal(!modal)}
|
|
/>
|
|
<Switch
|
|
checkedChildren="Modal2"
|
|
unCheckedChildren="Modal2"
|
|
checked={modal2}
|
|
onChange={() => setModal2(!modal2)}
|
|
/>
|
|
</Space>
|
|
<Drawer title="Drawer" open={drawer}>
|
|
Some contents...
|
|
<Drawer title="Drawer Sub" open={drawer}>
|
|
Sub contents...
|
|
</Drawer>
|
|
</Drawer>
|
|
<Drawer title="Drawer2" open={drawer2}>
|
|
Some contents...
|
|
</Drawer>
|
|
<Modal title="Modal" open={modal}>
|
|
Some contents...
|
|
</Modal>
|
|
<Modal title="Modal2" open={modal2}>
|
|
Some contents...
|
|
</Modal>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default App;
|