feat: 更新素材表单组件，优化状态管理和数据获取逻辑，移除不必要的状态，使用useCallback提升性能

nkebao/src/pages/mobile/content/materials/form/index.tsx

@@ -1,7 +1,7 @@
-import React, { useState, useEffect } from "react";
+import React, { useState, useEffect, useCallback } from "react";
 import { useNavigate, useParams } from "react-router-dom";
 import { Button, Toast, SpinLoading, Card } from "antd-mobile";
-import { Input, TimePicker, Select } from "antd";
+import { Input, Select } from "antd";
 import {
   ArrowLeftOutlined,
   SaveOutlined,
@@ -20,7 +20,6 @@ import {
   createContentItem,
   updateContentItem,
 } from "./api";
-import { ContentItem } from "./data";
 import style from "./index.module.scss";
 
 const { Option } = Select;
@@ -43,7 +42,6 @@ const MaterialForm: React.FC = () => {
   }>();
   const [loading, setLoading] = useState(false);
   const [saving, setSaving] = useState(false);
-  const [material, setMaterial] = useState<ContentItem | null>(null);
 
   // 表单状态
   const [contentType, setContentType] = useState<number>(4);
@@ -52,9 +50,6 @@ const MaterialForm: React.FC = () => {
   const [comment, setComment] = useState("");
   const [sendTime, setSendTime] = useState("");
   const [resUrls, setResUrls] = useState<string[]>([]);
-  const [urls, setUrls] = useState<
-    { desc: string; image: string; url: string }[]
-  >([]);
 
   // 链接相关状态
   const [linkDesc, setLinkDesc] = useState("");
@@ -68,13 +63,7 @@ const MaterialForm: React.FC = () => {
   const isEdit = !!materialId;
 
   // 获取素材详情
-  useEffect(() => {
-    if (isEdit && materialId) {
-      fetchMaterialDetail();
-    }
-  }, [isEdit, materialId]);
-
-  const fetchMaterialDetail = async () => {
+  const fetchMaterialDetail = useCallback(async () => {
     if (!materialId) return;
     setLoading(true);
     try {
@@ -95,7 +84,6 @@ const MaterialForm: React.FC = () => {
       }
 
       setResUrls(response.resUrls || []);
-      setUrls(response.urls || []);
 
       // 设置链接相关数据
       if (response.urls && response.urls.length > 0) {
@@ -111,7 +99,13 @@ const MaterialForm: React.FC = () => {
     } finally {
       setLoading(false);
     }
-  };
+  }, [materialId]);
+
+  useEffect(() => {
+    if (isEdit && materialId) {
+      fetchMaterialDetail();
+    }
+  }, [isEdit, materialId, fetchMaterialDetail]);
 
   const handleSubmit = async () => {
     if (!libraryId) return;
@@ -149,14 +143,13 @@ const MaterialForm: React.FC = () => {
         urls: finalUrls,
       };
 
-      let response;
       if (isEdit) {
-        response = await updateContentItem({
+        await updateContentItem({
           id: materialId!,
           ...params,
         });
       } else {
-        response = await createContentItem(params);
+        await createContentItem(params);
       }
 
       // 直接使用返回数据，无需判断code
@@ -269,7 +262,6 @@ const MaterialForm: React.FC = () => {
                     value={linkImage ? [linkImage] : []}
                     onChange={urls => setLinkImage(urls[0] || "")}
                     count={1}
-                    listType="picture-card"
                   />
                 </div>
 
@@ -314,7 +306,6 @@ const MaterialForm: React.FC = () => {
                       value={resUrls}
                       onChange={setResUrls}
                       count={9}
-                      listType="picture-card"
                     />
                   </div>
                   <div
@@ -357,7 +348,6 @@ const MaterialForm: React.FC = () => {
                       value={resUrls}
                       onChange={setResUrls}
                       count={9}
-                      listType="picture-card"
                     />
                   </div>
                 </>