Skip to content

Commit ac9ff4e

Browse files
committed
feat: init
1 parent 4f5e932 commit ac9ff4e

File tree

11 files changed

+299
-162
lines changed

11 files changed

+299
-162
lines changed

docs/examples/change-remove.tsx

Lines changed: 64 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,8 @@
1-
/* eslint-disable no-console,react/no-multi-comp */
21
import { Icon, Menu } from 'antd';
32
import * as React from 'react';
43

54
import Drawer from 'rc-drawer';
65

7-
import 'antd/lib/menu/style';
8-
import 'antd/lib/style';
9-
10-
116
import '../../assets/index.less';
127
import './assets/index.less';
138

@@ -16,7 +11,7 @@ const MenuItemGroup = Menu.ItemGroup;
1611
class Demo extends React.Component<any, { show: boolean }> {
1712
public state = {
1813
show: true,
19-
}
14+
};
2015
public componentDidMount() {
2116
setTimeout(() => {
2217
this.setState({
@@ -26,55 +21,73 @@ class Demo extends React.Component<any, { show: boolean }> {
2621
}
2722
public render() {
2823
return (
29-
<div >
30-
{this.state.show && <Drawer
31-
wrapperClassName="drawer-wrapper"
32-
width="20vw"
33-
>
34-
<Menu
35-
defaultSelectedKeys={['1']}
36-
defaultOpenKeys={['sub1']}
37-
mode="inline"
38-
>
39-
<SubMenu
40-
key="sub1"
41-
title={<span><Icon type="mail" /><span>Navigation One</span></span>}
24+
<div>
25+
{this.state.show && (
26+
<Drawer wrapperClassName="drawer-wrapper" width="20vw">
27+
<Menu
28+
defaultSelectedKeys={['1']}
29+
defaultOpenKeys={['sub1']}
30+
mode="inline"
4231
>
43-
<MenuItemGroup key="g1" title="Item 1">
44-
<Menu.Item key="1">Option 1</Menu.Item>
45-
<Menu.Item key="2">Option 2</Menu.Item>
46-
</MenuItemGroup>
47-
<MenuItemGroup key="g2" title="Item 2">
48-
<Menu.Item key="3">Option 3</Menu.Item>
49-
<Menu.Item key="4">Option 4</Menu.Item>
50-
</MenuItemGroup>
51-
</SubMenu>
52-
<SubMenu
53-
key="sub2"
54-
title={<span><Icon type="appstore" /><span>Navigation Two</span></span>}
55-
>
56-
<Menu.Item key="5">Option 5</Menu.Item>
57-
<Menu.Item key="6">Option 6</Menu.Item>
58-
<SubMenu key="sub3" title="Submenu">
59-
<Menu.Item key="7">Option 7</Menu.Item>
60-
<Menu.Item key="8">Option 8</Menu.Item>
32+
<SubMenu
33+
key="sub1"
34+
title={
35+
<span>
36+
<Icon type="mail" />
37+
<span>Navigation One</span>
38+
</span>
39+
}
40+
>
41+
<MenuItemGroup key="g1" title="Item 1">
42+
<Menu.Item key="1">Option 1</Menu.Item>
43+
<Menu.Item key="2">Option 2</Menu.Item>
44+
</MenuItemGroup>
45+
<MenuItemGroup key="g2" title="Item 2">
46+
<Menu.Item key="3">Option 3</Menu.Item>
47+
<Menu.Item key="4">Option 4</Menu.Item>
48+
</MenuItemGroup>
6149
</SubMenu>
62-
</SubMenu>
63-
<SubMenu
64-
key="sub4"
65-
title={<span><Icon type="setting" /><span>Navigation Three</span></span>}
66-
>
67-
<Menu.Item key="9">Option 9</Menu.Item>
68-
<Menu.Item key="10">Option 10</Menu.Item>
69-
<Menu.Item key="11">Option 11</Menu.Item>
70-
<Menu.Item key="12">Option 12</Menu.Item>
71-
</SubMenu>
72-
</Menu>
73-
</Drawer>}
50+
<SubMenu
51+
key="sub2"
52+
title={
53+
<span>
54+
<Icon type="appstore" />
55+
<span>Navigation Two</span>
56+
</span>
57+
}
58+
>
59+
<Menu.Item key="5">Option 5</Menu.Item>
60+
<Menu.Item key="6">Option 6</Menu.Item>
61+
<SubMenu key="sub3" title="Submenu">
62+
<Menu.Item key="7">Option 7</Menu.Item>
63+
<Menu.Item key="8">Option 8</Menu.Item>
64+
</SubMenu>
65+
</SubMenu>
66+
<SubMenu
67+
key="sub4"
68+
title={
69+
<span>
70+
<Icon type="setting" />
71+
<span>Navigation Three</span>
72+
</span>
73+
}
74+
>
75+
<Menu.Item key="9">Option 9</Menu.Item>
76+
<Menu.Item key="10">Option 10</Menu.Item>
77+
<Menu.Item key="11">Option 11</Menu.Item>
78+
<Menu.Item key="12">Option 12</Menu.Item>
79+
</SubMenu>
80+
</Menu>
81+
</Drawer>
82+
)}
7483
<div
7584
style={{
76-
width: '100%', height: 667, background: '#fff000',
77-
color: '#fff', textAlign: 'center', lineHeight: '667px',
85+
width: '100%',
86+
height: 667,
87+
background: '#fff000',
88+
color: '#fff',
89+
textAlign: 'center',
90+
lineHeight: '667px',
7891
}}
7992
>
8093
内容区块

docs/examples/change.tsx

Lines changed: 36 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ const MenuItemGroup = Menu.ItemGroup;
1515
class Demo extends React.Component {
1616
public state = {
1717
open: true,
18-
}
18+
};
1919
public componentDidMount() {
2020
setTimeout(() => {
2121
this.setState({
@@ -25,20 +25,20 @@ class Demo extends React.Component {
2525
}
2626
public onChange = (bool: boolean) => {
2727
console.log('change: ', bool);
28-
}
28+
};
2929
public onTouchEnd = () => {
3030
this.setState({
3131
open: false,
3232
});
33-
}
33+
};
3434
public onSwitch = () => {
3535
this.setState({
3636
open: !this.state.open,
3737
});
38-
}
38+
};
3939
public render() {
4040
return (
41-
<div >
41+
<div>
4242
<Drawer
4343
onChange={this.onChange}
4444
open={this.state.open}
@@ -57,7 +57,12 @@ class Demo extends React.Component {
5757
>
5858
<SubMenu
5959
key="sub1"
60-
title={<span><Icon type="mail" /><span>Navigation One</span></span>}
60+
title={
61+
<span>
62+
<Icon type="mail" />
63+
<span>Navigation One</span>
64+
</span>
65+
}
6166
>
6267
<MenuItemGroup key="g1" title="Item 1">
6368
<Menu.Item key="1">Option 1</Menu.Item>
@@ -70,7 +75,12 @@ class Demo extends React.Component {
7075
</SubMenu>
7176
<SubMenu
7277
key="sub2"
73-
title={<span><Icon type="appstore" /><span>Navigation Two</span></span>}
78+
title={
79+
<span>
80+
<Icon type="appstore" />
81+
<span>Navigation Two</span>
82+
</span>
83+
}
7484
>
7585
<Menu.Item key="5">Option 5</Menu.Item>
7686
<Menu.Item key="6">Option 6</Menu.Item>
@@ -81,7 +91,12 @@ class Demo extends React.Component {
8191
</SubMenu>
8292
<SubMenu
8393
key="sub4"
84-
title={<span><Icon type="setting" /><span>Navigation Three</span></span>}
94+
title={
95+
<span>
96+
<Icon type="setting" />
97+
<span>Navigation Three</span>
98+
</span>
99+
}
85100
>
86101
<Menu.Item key="9">Option 9</Menu.Item>
87102
<Menu.Item key="10">Option 10</Menu.Item>
@@ -92,14 +107,24 @@ class Demo extends React.Component {
92107
</Drawer>
93108
<div
94109
style={{
95-
width: '100%', height: 667, background: '#fff000',
96-
color: '#fff', textAlign: 'center', lineHeight: '667px',
110+
width: '100%',
111+
height: 667,
112+
background: '#fff000',
113+
color: '#fff',
114+
textAlign: 'center',
115+
lineHeight: '667px',
97116
}}
98117
>
99118
内容区块
100119
<button
101120
onClick={this.onSwitch}
102-
style={{ height: 24, width: 100, marginLeft: 20, color: '#000', lineHeight: '24px' }}
121+
style={{
122+
height: 24,
123+
width: 100,
124+
marginLeft: 20,
125+
color: '#000',
126+
lineHeight: '24px',
127+
}}
103128
>
104129
{!this.state.open ? '打开' : '关闭'}
105130
</button>

docs/examples/getContainer.tsx

Lines changed: 24 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -26,63 +26,60 @@ class DrawerTester extends React.Component {
2626
public render() {
2727
return (
2828
<div>
29-
<div ref={this.saveContainer} id="container"/>
30-
<Drawer
31-
width="20vw"
32-
getContainer={this.getContainer}
33-
>
29+
<div ref={this.saveContainer} id="container" />
30+
<Drawer width="20vw" getContainer={this.getContainer}>
3431
<Menu
3532
defaultSelectedKeys={['1']}
3633
defaultOpenKeys={['sub1']}
37-
mode='inline'
34+
mode="inline"
3835
>
3936
<SubMenu
40-
key='sub1'
37+
key="sub1"
4138
title={
4239
<span>
43-
<Icon type='mail' />
40+
<Icon type="mail" />
4441
<span>Navigation One</span>
4542
</span>
4643
}
4744
>
48-
<MenuItemGroup key='g1' title='Item 1'>
49-
<Menu.Item key='1'>Option 1</Menu.Item>
50-
<Menu.Item key='2'>Option 2</Menu.Item>
45+
<MenuItemGroup key="g1" title="Item 1">
46+
<Menu.Item key="1">Option 1</Menu.Item>
47+
<Menu.Item key="2">Option 2</Menu.Item>
5148
</MenuItemGroup>
52-
<MenuItemGroup key='g2' title='Item 2'>
53-
<Menu.Item key='3'>Option 3</Menu.Item>
54-
<Menu.Item key='4'>Option 4</Menu.Item>
49+
<MenuItemGroup key="g2" title="Item 2">
50+
<Menu.Item key="3">Option 3</Menu.Item>
51+
<Menu.Item key="4">Option 4</Menu.Item>
5552
</MenuItemGroup>
5653
</SubMenu>
5754
<SubMenu
58-
key='sub2'
55+
key="sub2"
5956
title={
6057
<span>
61-
<Icon type='appstore' />
58+
<Icon type="appstore" />
6259
<span>Navigation Two</span>
6360
</span>
6461
}
6562
>
66-
<Menu.Item key='5'>Option 5</Menu.Item>
67-
<Menu.Item key='6'>Option 6</Menu.Item>
68-
<SubMenu key='sub3' title='Submenu'>
69-
<Menu.Item key='7'>Option 7</Menu.Item>
70-
<Menu.Item key='8'>Option 8</Menu.Item>
63+
<Menu.Item key="5">Option 5</Menu.Item>
64+
<Menu.Item key="6">Option 6</Menu.Item>
65+
<SubMenu key="sub3" title="Submenu">
66+
<Menu.Item key="7">Option 7</Menu.Item>
67+
<Menu.Item key="8">Option 8</Menu.Item>
7168
</SubMenu>
7269
</SubMenu>
7370
<SubMenu
74-
key='sub4'
71+
key="sub4"
7572
title={
7673
<span>
77-
<Icon type='setting' />
74+
<Icon type="setting" />
7875
<span>Navigation Three</span>
7976
</span>
8077
}
8178
>
82-
<Menu.Item key='9'>Option 9</Menu.Item>
83-
<Menu.Item key='10'>Option 10</Menu.Item>
84-
<Menu.Item key='11'>Option 11</Menu.Item>
85-
<Menu.Item key='12'>Option 12</Menu.Item>
79+
<Menu.Item key="9">Option 9</Menu.Item>
80+
<Menu.Item key="10">Option 10</Menu.Item>
81+
<Menu.Item key="11">Option 11</Menu.Item>
82+
<Menu.Item key="12">Option 12</Menu.Item>
8683
</SubMenu>
8784
</Menu>
8885
</Drawer>

0 commit comments

Comments
 (0)