feat:文件列表持久化成功

main.js

@@ -65,18 +65,18 @@ app.whenReady().then(() => {
         return dialog.showSaveDialog({"title":"保存文件",})
     })
     ipcMain.handle("electronStoreSave",(listen,key,value)=>{
-        console.log("electronStoreSave")
+        console.log("electronStoreSave",key,value)
         return store.set(key,value)
     })
     ipcMain.handle("electronStoreGet",(listen,args)=>{
-        console.log("electronStoreGet")
+        console.log("electronStoreGet:",store.get(args))
         return store.get(args)
     })
     ipcMain.handle("electronStoreDelete",(listen,args)=>{
         console.log("electronStoreDelete")
         return store.delete(args)
     })
-    console.log("app.getPath('userData')",app.getPath('userData'))
+    console.log("配置文件地址",app.getPath('userData')+"/config.json")
 })
 // 除了 macOS 外，当所有窗口都被关闭的时候退出程序。 因此, 通常
 // 对应用程序和它们的菜单栏来说应该时刻保持激活状态, 

src/pages/Note/index.jsx

@@ -1,10 +1,6 @@
 import React, {useEffect, useRef, useState} from 'react';
 import {
-    MenuFoldOutlined,
-    MenuUnfoldOutlined,
-    UploadOutlined,
     UserOutlined,
-    VideoCameraOutlined,
 } from '@ant-design/icons';
 import {Layout, Menu, Button, theme, Avatar, Tabs} from 'antd';
 import Hlexical from './Hlexical';
@@ -12,46 +8,57 @@ import ItemTree from "../../components/ItemTree";
 import './index.less'
 import {store} from "../../redux/store";
 import {isEmpty} from "../../utils/ObjectUtils";
+import {useSelector, useDispatch} from "react-redux";
+import {addTableBarItem} from "../../redux/tableBarItem_reducer"
 
 const {Header, Sider, Content} = Layout;
 const Note = () => {
+    const dispatch = useDispatch()
     const [collapsed, setCollapsed] = useState(false);
     //   const {
     //     token: { colorBgContainer },
     //   } = theme.useToken();
     const colorBgContainer = '#800080'
     const [activeKey, setActiveKey] = useState();
-    const [items, setItems] = useState([]);
     const newTabIndex = useRef(0);
-    store.subscribe(() => {
+    const items = useSelector(state => state.tableBarItem.data)
-            const openFile = store.getState().clickFileMessage.data;
+    const openFile = useSelector(state => state.clickFileMessage.data)
-            console.log("store.getState().clickFileMessage.data:",openFile,items)
+    console.log("store.getState().clickFileMessage.data:",openFile)
-            if (!isEmpty(openFile)&&activeKey!==openFile.filePath){
+    if (!isEmpty(openFile) && activeKey !== openFile.filePath&&isEmpty(activeKey)) {
         setActiveKey(openFile.filePath)
     }
-            if (items.filter(fileItem => fileItem.key === openFile.filePath).length === 0&& !isEmpty(openFile)) {
+    if (items.filter(fileItem => fileItem.key === openFile.filePath).length === 0 && !isEmpty(openFile)) {
-                setItems([...items,
+        console.log("items.filter(fileItem => fileItem.key === openFile.filePath)",items)
+        dispatch(addTableBarItem(
             {
                 label: openFile.fileName,
-                        children: <div className="HlexicalName"><Hlexical filePath={openFile.filePath} /></div>,
+                children: openFile.filePath,
                 key: openFile.filePath,
             }
-                ])
+        ))
     }
-        }
+
-    )
+
     const onChange = (newActiveKey) => {
+        console.log("setActiveKey(newActiveKey)",newActiveKey)
         setActiveKey(newActiveKey);
     };
     const add = () => {
         const newActiveKey = `newTab${newTabIndex.current++}`;
-        const newPanes = [...items];
+        // const newPanes = [...items];
-        newPanes.push({
+        // newPanes.push({
+        //     label: 'New Tab',
+        //     children: <div className="HlexicalName"><Hlexical /></div>,
+        //     key: newActiveKey,
+        // });
+        // setItems(newPanes);
+        dispatch(addTableBarItem(
+            {
                 label: 'New Tab',
-            children: <div className="HlexicalName"><Hlexical /></div>,
+                children: "",
                 key: newActiveKey,
-        });
+            }
-        setItems(newPanes);
+        ));
         setActiveKey(newActiveKey);
     };
     const remove = (targetKey) => {
@@ -70,7 +77,7 @@ const Note = () => {
                 newActiveKey = newPanes[0].key;
             }
         }
-        setItems(newPanes);
+        // setItems(newPanes);
         setActiveKey(newActiveKey);
     };
     const onEdit = (targetKey, action) => {
@@ -100,7 +107,7 @@ const Note = () => {
                     onChange={onChange}
                     activeKey={activeKey}
                     onEdit={onEdit}
-                    items={items}
+                    items={items.map(item=>{return {label:item.label,children: <div className="HlexicalName"><Hlexical  filePath={item.children}/></div>,key:item.key}})}
                 />
             </Layout>
         </Layout>

src/redux/store.js

@@ -1,4 +1,4 @@
-import {combineReducers, configureStore} from '@reduxjs/toolkit'
+import {configureStore} from '@reduxjs/toolkit'
 import historyReducer from './historyRecord_reducer'
 import redirectReducer from './redirectUrl_reducer'
 import dirMessageReducer from './dirMessage_reducer'
@@ -7,8 +7,8 @@ import pushHotkeysReducer from "./pushHotkeys_reducer";
 import tableBarItemReducer from "./tableBarItem_reducer";
 import {electronStorage} from "../utils/LocalStorage";
 import { persistStore, persistReducer } from 'redux-persist'
+import {FLUSH, PAUSE, PERSIST, PURGE, REGISTER, REHYDRATE} from "redux-persist/es/constants";
 // 持久化配置
-
 const historyRecordPersistConfig = {
     key: 'historyRecord',
     storage: electronStorage()
@@ -49,7 +49,11 @@ export const store = configureStore({
         dirMessage:dirMessagePersistedReducer,
         pushHotkeys:pushHotkeysPersistedReducer,
         clickFileMessage:clickFileMessagePersistedReducer,
-        tableBarItem:tableBarItemPersistedReducer
+        tableBarItem:tableBarItemPersistedReducer,
-    }
+    },
+    middleware: (getDefaultMiddleware) =>
+        getDefaultMiddleware({
+            serializableCheck: false
+        }),
 })
 export const  persistor = persistStore(store);

src/redux/tableBarItem_reducer.js

@@ -4,14 +4,22 @@ export const tableBarItemSlice = createSlice({
     name: 'tableBarItem',
     initialState: {
         type:"tableBarItem",
-        data: []
+        data: [],
+        activeKey:""
     },
     reducers: {
-        tableBarItem: (state, action) => {
+        addTableBarItem: (state, action) => {
-            console.log("tableBarItemSlice:tableBarItem", state, action)
+            console.log("tableBarItemSlice:tableBarItem=====", state, action,)
-            state.data=action.payload
+            if (state.data.filter(file=>file.key===action.payload.key).length===0){
+                state.data.push(action.payload)
+            }
+        },
+        setActiveKey:(state,action)=>{
+            if (state.activeKey!==action.payload){
+                state.activeKey=action.payload;
+            }
         }
     }
 })
-export const { tableBarItem } = tableBarItemSlice.actions
+export const { addTableBarItem,setActiveKey } = tableBarItemSlice.actions
 export default tableBarItemSlice.reducer