Skip to content

Commit e7b6666

Browse files
committed
feat: 上传的文件也能实时保存,即使刷新页面
1 parent fbb1fd2 commit e7b6666

File tree

1 file changed

+29
-4
lines changed

1 file changed

+29
-4
lines changed

src/pages/MarkdownEditor.tsx

Lines changed: 29 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -29,18 +29,31 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ruleContent, roleContent
2929
const saved = localStorage.getItem('markdownContent');
3030
return saved || '';
3131
});
32-
const [files, setFiles] = useState<FileInfo[]>([]);
32+
const [files, setFiles] = useState<FileInfo[]>(() => {
33+
const savedFiles = localStorage.getItem('uploadedFiles');
34+
return savedFiles ? JSON.parse(savedFiles) : [];
35+
});
3336
const [previewFile, setPreviewFile] = useState<FileInfo | null>(null);
3437
const [isDialogOpen, setIsDialogOpen] = useState(false);
3538
const previewContentRef = useRef<HTMLDivElement>(null);
3639

40+
// 持久化markdown内容
3741
useEffect(() => {
3842
const timer = setTimeout(() => {
3943
localStorage.setItem('markdownContent', markdownContent);
4044
}, 500);
4145
return () => clearTimeout(timer);
4246
}, [markdownContent]);
4347

48+
// 持久化上传文件
49+
useEffect(() => {
50+
const timer = setTimeout(() => {
51+
localStorage.setItem('uploadedFiles', JSON.stringify(files));
52+
}, 500);
53+
return () => clearTimeout(timer);
54+
}, [files]);
55+
56+
// 恢复滚动位置
4457
useEffect(() => {
4558
if (previewFile && previewContentRef.current) {
4659
const savedScrollTop = parseInt(
@@ -52,7 +65,17 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ruleContent, roleContent
5265
}, [previewFile]);
5366

5467
const handleFilesUploaded = (newFiles: FileInfo[]) => {
55-
setFiles(prev => [...prev, ...newFiles]);
68+
setFiles(prev => {
69+
const updatedFiles = [...prev, ...newFiles];
70+
// 去重逻辑
71+
const uniqueFiles = updatedFiles.reduce((acc, current) => {
72+
if (!acc.some(file => file.path === current.path)) {
73+
acc.push(current);
74+
}
75+
return acc;
76+
}, [] as FileInfo[]);
77+
return uniqueFiles;
78+
});
5679
};
5780

5881
const formatFileSize = (bytes: number) => {
@@ -69,8 +92,10 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ruleContent, roleContent
6992
};
7093

7194
const handleDeleteFile = (index: number) => {
72-
const newFiles = files.filter((_, i) => i !== index);
73-
setFiles(newFiles);
95+
setFiles(prev => {
96+
const newFiles = prev.filter((_, i) => i !== index);
97+
return newFiles;
98+
});
7499
if (previewFile?.name === files[index]?.name) {
75100
setIsDialogOpen(false);
76101
}

0 commit comments

Comments
 (0)