+ {/* 轮播背景图 - 确保有明确尺寸 */}
+
{/* 固定的烽火要闻 */}
-
diff --git a/app/components/news/header/TopNav.tsx b/app/components/news/header/TopNav.tsx
index b40a7ad..8eaf5ed 100644
--- a/app/components/news/header/TopNav.tsx
+++ b/app/components/news/header/TopNav.tsx
@@ -1,6 +1,6 @@
import { Search } from 'lucide-react';
-import React, { useState, useEffect } from 'react';
-
+import React, { useState,useEffect} from 'react';
+import { Button } from '@/ui/button';
interface MenuItem {
label: string;
key: string;
@@ -29,15 +29,7 @@ export function TopNav({
const [internalActiveKey, setInternalActiveKey] = useState('home');
const currentActiveKey = externalActiveKey !== undefined ? externalActiveKey : internalActiveKey;
const [searchKeyword, setSearchKeyword] = useState('');
- const [activeIndex, setActiveIndex] = useState(0);
- const [prevIndex, setPrevIndex] = useState(0);
-
- // 监听激活项变化,更新索引和动画方向
- useEffect(() => {
- const currentIndex = menuItems.findIndex(item => item.key === currentActiveKey);
- setPrevIndex(activeIndex);
- setActiveIndex(currentIndex);
- }, [currentActiveKey, menuItems, activeIndex]);
+
const handleSearchSubmit = (e: React.FormEvent) => {
e.preventDefault();
@@ -52,61 +44,53 @@ export function TopNav({
};
return (
-
+ // 将组件宽度调整为1514px,并保持居中
+
{/* 搜索框与导航菜单组合 */}
-
+
{/* 搜索框 */}
-
+
+
+
+
+ {/* 导航菜单 */}
+
+ {menuItems.map((item) => {
const isActive = currentActiveKey === item.key;
return (
- -
+
-
);
})}
+
+
+
);