将数据能够存储数据库

app/components/news/body/Culturebg.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
-import { newsStore } from '@/store/newsStore';
+import { useNewsStore } from '@/store/newsStore';
 
 export default function CultureBgPage() {
   // 定义logo数据数组，包含16个logo信息
-  const {logos} = newsStore();
+  const {logos} = useNewsStore();
     
 
   return (

app/components/news/body/ImageGridSection.tsx

@@ -1,5 +1,5 @@
 import { CarouselDemo } from '@/components/Carousel'; // 导入轮播图组件
-import { newsStore } from '@/store/newsStore';
+import { useNewsStore } from '@/store/newsStore';
 import React from 'react';
 
 
@@ -7,7 +7,7 @@ import React from 'react';
 // LearnPage 组件定义
 const LearnPage = () => {
     // 新闻列表数据，用于显示在右侧新闻列表区
-    const {newsList,booksList} = newsStore();
+    const {newsList,booksList} = useNewsStore();
     {/* 水平居中
         使用背景图片方式展示logo 覆盖 只显示1 外边距
         弹性 默认纵向 大屏子元素横向  */ }

app/components/news/body/Integrated.tsx

@@ -1,8 +1,8 @@
-import {newsStore }from '@/store/newsStore';
+import {useNewsStore }from '@/store/newsStore';
 
 export default function Integrated() {
   // 在组件内部调用 zustand hook
-  const { services } = newsStore();
+  const { services } = useNewsStore();
   
   // 将一维服务数组转换为三维数组，分为3列，每列4个服务项
   // 结构: [[列1的4项], [列2的4项], [列3的4项]]

app/components/news/body/Train.tsx

@@ -1,12 +1,15 @@
 import { CarouselDemo } from '@/components/Carousel'; // 导入轮播图组件
 import React from 'react';
 
+
 interface NewsItem {
     id: string;
     content: string;
     url: string;
 }
 
+
+
 // LearnPage 组件定义
 const Train = () => {
     // 新闻列表数据，用于显示在右侧新闻列表区
@@ -62,6 +65,7 @@ const Train = () => {
             <div className="w-5/6 mx-auto">
                 {/* 顶部Logo区：使用背景图片方式展示logo，宽70高20 */}
                 <div className="w-70 h-20 bg-cover bg-no-repeat mb-5 mt-20" style={{ backgroundImage: "url('images/learn.png')" }}></div>
+                
                 <div className="flex flex-col lg:flex-row">
                     {/* 使用grid布局来安排图片的位置 */}
                     <div className="grid grid-cols-12 grid-rows-2 w-full h-130 ">

app/components/news/header/TopNav.tsx

@@ -1,7 +1,7 @@
 import { Search } from 'lucide-react';
 import React, { useState, useEffect } from 'react';
 import { Button } from '@/ui/button';
-import { newsStore,type MenuItem} from '@/store/newsStore';
+import { useNewsStore,type MenuItem} from '@/store/newsStore';
 
 
 
@@ -21,7 +21,7 @@ export function TopNav({
   const [internalActiveKey, setInternalActiveKey] = useState('home');
   const currentActiveKey = externalActiveKey !== undefined ? externalActiveKey : internalActiveKey;
   const [searchKeyword, setSearchKeyword] = useState('');
-  const {menuItems} = newsStore();
+  const {menuItems} = useNewsStore();
 
 
   const handleSearchSubmit = (e: React.FormEvent) => {

app/store/newsStore.ts

@@ -14,6 +14,7 @@ import {
   FaBookOpenReader,
   FaPenRuler,
 } from 'react-icons/fa6';
+import { persist, createJSONStorage } from 'zustand/middleware'
 
 
 //文化符号徽章
@@ -46,10 +47,17 @@ type NewsStore = {
   newsList: NewsItem[];
   booksList: NewsItem[];
   services: ServiceItem[];
-  menuItems:MenuItem[];
+  menuItems: MenuItem[];
+  // 添加 setter 方法
+  setLogos: (logos: Logo[]) => void;
+  setNewsList: (news: NewsItem[]) => void;
+  setBooksList: (books: NewsItem[]) => void;
+  setServices: (services: ServiceItem[]) => void;
+  setMenuItems: (items: MenuItem[]) => void;
 };
 
-export const newsStore = create<NewsStore>(() => ({
+// 初始数据
+const initialData = {
   logos: [
     { id: 1, src: "/public/logo/1.png", alt: "Logo 1" },
     { id: 2, src: "/public/logo/1.png", alt: "Logo 2" },
@@ -142,12 +150,34 @@ export const newsStore = create<NewsStore>(() => ({
     { icon: FaBookOpenReader, label: '考试平台', href: '/exam' },
     { icon: FaPenRuler, label: '学习平台', href: '/study' },
   ],
-  menuItems :[
-    { label: '首页', key: 'home', sectionId:'home' },
-    { label: '烽火动态', key: 'news', sectionId:'fireNews' },
-    { label: '烽火铸魂', key: 'soul', sectionId:'soul' },
-    { label: '烽火训练', key: 'training', sectionId:'training' },
-    { label: '联系热线', key: 'hotline', sectionId:'hotline' },
-    { label: '综合服务', key: 'service', sectionId:'service' },
+  menuItems: [
+    { label: '首页', key: 'home', sectionId: 'home' },
+    { label: '烽火动态', key: 'news', sectionId: 'fireNews' },
+    { label: '烽火铸魂', key: 'soul', sectionId: 'soul' },
+    { label: '烽火训练', key: 'training', sectionId: 'training' },
+    { label: '联系热线', key: 'hotline', sectionId: 'hotline' },
+    { label: '综合服务', key: 'service', sectionId: 'service' },
   ],
+};
+
+export const useNewsStore = create<NewsStore>()(persist((set) => ({
+  ...initialData,
+  // Setter 方法实现
+  setLogos: (logos) => set({ logos }),
+  setNewsList: (newsList) => set({ newsList }),
+  setBooksList: (booksList) => set({ booksList }),
+  setServices: (services) => set({ services }),
+  setMenuItems: (menuItems) => set({ menuItems }),
+}), { 
+  name: 'news-store', 
+  storage: createJSONStorage(() => localStorage),
 }));
+
+// 初始化时强制写入 localStorage（仅在首次加载时）
+if (typeof window !== 'undefined') {
+  const stored = localStorage.getItem('news-store');
+  if (!stored) {
+    // 如果 localStorage 中没有数据，手动触发一次保存
+    useNewsStore.setState(initialData);
+  }
+}