Skip to content

Commit 534608e

Browse files
author
liyuan-meng
committed
[CDropdown]修改下拉菜单样式
1 parent 7843191 commit 534608e

3 files changed

Lines changed: 47 additions & 93 deletions

File tree

src/components/c-dropdown/demos/arrow.md

Lines changed: 38 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -43,99 +43,44 @@ class DropdownDemo extends React.Component {
4343
</Dropdown.Menu>
4444
);
4545
return (
46-
<div>
47-
<p style={{ marginBottom: 10 }}>箭头居中</p>
48-
<div style={style}>
49-
<Dropdown
50-
trigger={['click']}
51-
arrow={{ pointAtCenter: true }}
52-
overlay={overlay}
53-
placement="bottom">
54-
<Button type="normal">向下-箭头居中</Button>
55-
</Dropdown>
56-
<Dropdown
57-
trigger={['click']}
58-
arrow={{ pointAtCenter: true }}
59-
overlay={overlay}
60-
placement="bottomLeft">
61-
<Button type="normal">向左下-箭头居中</Button>
62-
</Dropdown>
63-
<Dropdown
64-
trigger={['click']}
65-
arrow={{ pointAtCenter: true }}
66-
overlay={overlay}
67-
placement="bottomRight">
68-
<Button type="normal">向右下-箭头居中</Button>
69-
</Dropdown>
70-
<Dropdown
71-
trigger={['click']}
72-
arrow={{ pointAtCenter: true }}
73-
overlay={overlay}
74-
placement="top">
75-
<Button type="normal">向上-箭头居中</Button>
76-
</Dropdown>
77-
<Dropdown
78-
trigger={['click']}
79-
arrow={{ pointAtCenter: true }}
80-
overlay={overlay}
81-
placement="topLeft">
82-
<Button type="normal">向左上-箭头居中</Button>
83-
</Dropdown>
84-
<Dropdown
85-
trigger={['click']}
86-
arrow={{ pointAtCenter: true }}
87-
overlay={overlay}
88-
placement="topRight">
89-
<Button type="normal">向右上-箭头居中</Button>
90-
</Dropdown>
91-
</div>
92-
<p style={{ marginTop: 24, marginBottom: 10 }}>箭头不居中</p>
93-
<div style={{ ...style }}>
94-
95-
<Dropdown
96-
trigger={['click']}
97-
arrow
98-
overlay={overlay}
99-
placement="bottom">
100-
<Button type="normal">向下-箭头不居中</Button>
101-
</Dropdown>
102-
<Dropdown
103-
trigger={['click']}
104-
arrow
105-
overlay={overlay}
106-
placement="bottomLeft">
107-
<Button type="normal">向左下-箭头不居中</Button>
108-
</Dropdown>
109-
<Dropdown
110-
trigger={['click']}
111-
arrow
112-
overlay={overlay}
113-
placement="bottomRight">
114-
<Button type="normal">向右下-箭头不居中</Button>
115-
</Dropdown>
116-
<Dropdown
117-
trigger={['click']}
118-
arrow
119-
overlay={overlay}
120-
placement="top">
121-
<Button type="normal">向上-箭头不居中</Button>
122-
</Dropdown>
123-
<Dropdown
124-
trigger={['click']}
125-
arrow
126-
overlay={overlay}
127-
placement="topLeft">
128-
<Button type="normal">向左上-箭头不居中</Button>
129-
</Dropdown>
130-
<Dropdown
131-
trigger={['click']}
132-
arrow
133-
overlay={overlay}
134-
placement="topRight">
135-
<Button type="normal">向右上-箭头不居中</Button>
136-
</Dropdown>
137-
</div>
138-
</div>
46+
<div style={style}>
47+
<Dropdown
48+
arrow
49+
overlay={overlay}
50+
placement="bottom">
51+
<Button type="normal">向下</Button>
52+
</Dropdown>
53+
<Dropdown
54+
arrow
55+
overlay={overlay}
56+
placement="bottomLeft">
57+
<Button type="normal">向左下</Button>
58+
</Dropdown>
59+
<Dropdown
60+
arrow
61+
overlay={overlay}
62+
placement="bottomRight">
63+
<Button type="normal">向右下</Button>
64+
</Dropdown>
65+
<Dropdown
66+
arrow
67+
overlay={overlay}
68+
placement="top">
69+
<Button type="normal">向上</Button>
70+
</Dropdown>
71+
<Dropdown
72+
arrow
73+
overlay={overlay}
74+
placement="topLeft">
75+
<Button type="normal">向左上</Button>
76+
</Dropdown>
77+
<Dropdown
78+
arrow
79+
overlay={overlay}
80+
placement="topRight">
81+
<Button type="normal">向右上</Button>
82+
</Dropdown>
83+
</div>
13984
);
14085
}
14186
}

src/components/c-dropdown/index.less

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,17 @@
99
width: fit-content;
1010
margin-top: -4px;
1111
}
12+
.@{dropdown-prefix-cls}-placement-top,
13+
.@{dropdown-prefix-cls}-placement-topLeft,
14+
.@{dropdown-prefix-cls}-placement-topRight {
15+
.@{dropdown-prefix-cls}-menu-area {
16+
margin-bottom: -2px;
17+
}
18+
}
1219
.@{dropdown-prefix-cls}-show-arrow {
1320
.@{dropdown-prefix-cls}-menu-area {
1421
margin-top: 0;
22+
margin-bottom: 0;
1523
}
1624
}
1725
.@{dropdown-prefix-cls} {

src/components/c-dropdown/index.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ group:
2929
| placement | 菜单弹出位置:`bottom` `bottomLeft` `bottomRight` `top` `topLeft` `topRight` | string | `bottomLeft` |
3030
| trigger | 触发下拉的行为, 移动端不支持 hover | Array&lt;`click`\|`hover`\|`contextMenu`> | \[`hover`] |
3131
| open | 菜单是否显示 | boolean | - |
32+
| arrow | 是否展示剪头 | boolean | false |
3233
| onOpenChange | 菜单显示状态改变时调用,点击菜单按钮导致的消失不会触发。| (open: boolean) => void | - |
3334

3435
### Dropdown.Button

0 commit comments

Comments
 (0)