Skip to content

Commit fbc4cdb

Browse files
committed
修复移动端标签筛选菜单显示错乱问题
1 parent 93b2a7a commit fbc4cdb

File tree

1 file changed

+29
-5
lines changed

1 file changed

+29
-5
lines changed

src/components/ChallengeListPage/ChallengeControls.tsx

Lines changed: 29 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -153,10 +153,13 @@ const ChallengeControls: React.FC<ChallengeControlsProps> = ({
153153
maxHeight: isMobile ? '300px' : '400px',
154154
overflowY: 'auto',
155155
minWidth: isMobile ? '250px' : '300px',
156+
maxWidth: isMobile ? '80vw' : 'none',
156157
backgroundColor: '#fff',
157158
boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
158159
borderRadius: '4px',
159-
border: '1px solid #f0f0f0'
160+
border: '1px solid #f0f0f0',
161+
position: 'relative',
162+
zIndex: 1050
160163
}}>
161164
{/* 添加标签搜索框 */}
162165
<Input
@@ -213,7 +216,16 @@ const ChallengeControls: React.FC<ChallengeControlsProps> = ({
213216
wrap={!isMobile}
214217
>
215218
{/* 标签过滤 */}
216-
<Dropdown overlay={tagMenu} trigger={['click']}>
219+
<Dropdown
220+
overlay={tagMenu}
221+
trigger={['click']}
222+
placement={isMobile ? "bottomCenter" : "bottomLeft"}
223+
overlayStyle={{
224+
position: 'fixed',
225+
marginTop: '8px',
226+
zIndex: 1050
227+
}}
228+
>
217229
<Button
218230
icon={<TagOutlined />}
219231
size={isMobile ? "middle" : "default"}
@@ -224,7 +236,11 @@ const ChallengeControls: React.FC<ChallengeControlsProps> = ({
224236
</Dropdown>
225237

226238
{/* 难度过滤 */}
227-
<Dropdown overlay={difficultyMenu} trigger={['click']}>
239+
<Dropdown
240+
overlay={difficultyMenu}
241+
trigger={['click']}
242+
placement={isMobile ? "bottomCenter" : "bottomLeft"}
243+
>
228244
<Button
229245
icon={<FilterOutlined />}
230246
size={isMobile ? "middle" : "default"}
@@ -235,7 +251,11 @@ const ChallengeControls: React.FC<ChallengeControlsProps> = ({
235251
</Dropdown>
236252

237253
{/* 平台过滤 */}
238-
<Dropdown overlay={platformMenu} trigger={['click']}>
254+
<Dropdown
255+
overlay={platformMenu}
256+
trigger={['click']}
257+
placement={isMobile ? "bottomCenter" : "bottomLeft"}
258+
>
239259
<Button
240260
icon={<FilterOutlined />}
241261
size={isMobile ? "middle" : "default"}
@@ -247,7 +267,11 @@ const ChallengeControls: React.FC<ChallengeControlsProps> = ({
247267

248268
{/* 排序控制 - 移到最后 */}
249269
<Space style={{ width: isMobile ? '100%' : 'auto' }}>
250-
<Dropdown overlay={sortMenu} trigger={['click']}>
270+
<Dropdown
271+
overlay={sortMenu}
272+
trigger={['click']}
273+
placement={isMobile ? "bottomCenter" : "bottomLeft"}
274+
>
251275
<Button
252276
size={isMobile ? "middle" : "default"}
253277
style={{

0 commit comments

Comments
 (0)