Skip to content

Commit 133fd21

Browse files
zombieJzombieJ
authored
Merge pull request #243 from crazyair/refactor-test
Refactor test
2 parents 4f5e932 + e203d24 commit 133fd21

18 files changed

+533
-397
lines changed

‎.eslintrc.js‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
1-
const base = require('@umijs/fabric/dist/eslint');
2-
31
module.exports = {
4-
...base,
2+
extends: [require.resolve('@umijs/fabric/dist/eslint')],
53
rules: {
6-
...base.rules,
74
'no-template-curly-in-string': 0,
85
'prefer-promise-reject-errors': 0,
96
'react/no-array-index-key': 0,
@@ -13,5 +10,6 @@ module.exports = {
1310
'no-param-reassign': 0,
1411
'no-restricted-globals': 0,
1512
'@typescript-eslint/no-explicit-any': 0,
13+
'@typescript-eslint/no-shadow': 'off',
1614
},
17-
};
15+
};

‎docs/demo/base.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
## base
2+
3+
<code src="../examples/base.tsx">

‎docs/examples/base.tsx‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
/* eslint-disable @typescript-eslint/no-unused-vars */
2+
import React, { useState } from 'react';
3+
import Drawer from 'rc-drawer';
4+
5+
const Demo = () => {
6+
const [open, setOpen] = useState(false);
7+
const onChange = (bool: boolean) => {
8+
// console.log('change: ', bool);
9+
};
10+
const onTouchEnd = () => {
11+
setOpen(false);
12+
};
13+
const onSwitch = () => {
14+
setOpen(c => !c);
15+
};
16+
return (
17+
<div>
18+
<Drawer
19+
onChange={onChange}
20+
open={open}
21+
// defaultOpen
22+
onClose={onTouchEnd}
23+
handler={false}
24+
level={null}
25+
afterVisibleChange={(c: boolean) => {
26+
// console.log('transitionEnd: ', c);
27+
}}
28+
placement="right"
29+
width={400}
30+
>
31+
content
32+
</Drawer>
33+
<div>
34+
<button onClick={onSwitch}>打开</button>
35+
</div>
36+
</div>
37+
);
38+
};
39+
export default Demo;

‎docs/examples/change-remove.tsx‎

Lines changed: 66 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,9 @@
1-
/* eslint-disable no-console,react/no-multi-comp */
2-
import { Icon, Menu } from 'antd';
1+
import { AppstoreOutlined, MailOutlined, SettingOutlined } from '@ant-design/icons';
2+
import { Menu } from 'antd';
33
import * as React from 'react';
44

55
import Drawer from 'rc-drawer';
66

7-
import 'antd/lib/menu/style';
8-
import 'antd/lib/style';
9-
10-
117
import '../../assets/index.less';
128
import './assets/index.less';
139

@@ -16,7 +12,7 @@ const MenuItemGroup = Menu.ItemGroup;
1612
class Demo extends React.Component<any, { show: boolean }> {
1713
public state = {
1814
show: true,
19-
}
15+
};
2016
public componentDidMount() {
2117
setTimeout(() => {
2218
this.setState({
@@ -26,55 +22,73 @@ class Demo extends React.Component<any, { show: boolean }> {
2622
}
2723
public render() {
2824
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>}
25+
<div>
26+
{this.state.show && (
27+
<Drawer wrapperClassName="drawer-wrapper" width="20vw">
28+
<Menu
29+
defaultSelectedKeys={['1']}
30+
defaultOpenKeys={['sub1']}
31+
mode="inline"
4232
>
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>
33+
<SubMenu
34+
key="sub1"
35+
title={
36+
<span>
37+
<MailOutlined />
38+
<span>Navigation One</span>
39+
</span>
40+
}
41+
>
42+
<MenuItemGroup key="g1" title="Item 1">
43+
<Menu.Item key="1">Option 1</Menu.Item>
44+
<Menu.Item key="2">Option 2</Menu.Item>
45+
</MenuItemGroup>
46+
<MenuItemGroup key="g2" title="Item 2">
47+
<Menu.Item key="3">Option 3</Menu.Item>
48+
<Menu.Item key="4">Option 4</Menu.Item>
49+
</MenuItemGroup>
6150
</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>}
51+
<SubMenu
52+
key="sub2"
53+
title={
54+
<span>
55+
<AppstoreOutlined />
56+
<span>Navigation Two</span>
57+
</span>
58+
}
59+
>
60+
<Menu.Item key="5">Option 5</Menu.Item>
61+
<Menu.Item key="6">Option 6</Menu.Item>
62+
<SubMenu key="sub3" title="Submenu">
63+
<Menu.Item key="7">Option 7</Menu.Item>
64+
<Menu.Item key="8">Option 8</Menu.Item>
65+
</SubMenu>
66+
</SubMenu>
67+
<SubMenu
68+
key="sub4"
69+
title={
70+
<span>
71+
<SettingOutlined />
72+
<span>Navigation Three</span>
73+
</span>
74+
}
75+
>
76+
<Menu.Item key="9">Option 9</Menu.Item>
77+
<Menu.Item key="10">Option 10</Menu.Item>
78+
<Menu.Item key="11">Option 11</Menu.Item>
79+
<Menu.Item key="12">Option 12</Menu.Item>
80+
</SubMenu>
81+
</Menu>
82+
</Drawer>
83+
)}
7484
<div
7585
style={{
76-
width: '100%', height: 667, background: '#fff000',
77-
color: '#fff', textAlign: 'center', lineHeight: '667px',
86+
width: '100%',
87+
height: 667,
88+
background: '#fff000',
89+
color: '#fff',
90+
textAlign: 'center',
91+
lineHeight: '667px',
7892
}}
7993
>
8094
内容区块

‎docs/examples/change.tsx‎

Lines changed: 38 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
/* eslint-disable no-console,react/no-multi-comp */
2-
import { Icon, Menu } from 'antd';
1+
import { AppstoreOutlined, MailOutlined, SettingOutlined } from '@ant-design/icons';
2+
import { Menu } from 'antd';
33
import * as React from 'react';
44

55
import Drawer from 'rc-drawer';
@@ -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+
<MailOutlined />
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+
<AppstoreOutlined />
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+
<SettingOutlined />
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>

0 commit comments

Comments
 (0)