feat: electron 保存触发一次

main.js

@@ -1,9 +1,6 @@
-// npm start
 const {app, Menu, BrowserWindow} = require('electron')
 const path = require('path')
 const {menuRebuild} = require('./src/comment/TopMenu.js')
-// const {SAVE} = require("./src/utils/HotkeyConst");
-// const {PUSH_HOTKEY} = require("./src/utils/MainContentsChannel");
 const createWindow = () => {
     // Create the browser window.
     const win = new BrowserWindow({
@@ -21,20 +18,31 @@ const createWindow = () => {
     win.loadURL('http://localhost:3000')
     // 打开开发工具
     win.webContents.openDevTools()
+    // let okPush =false
+    let devToolPush = false
     win.webContents.on('before-input-event', (event, input) => {
-        if (input.control && input.key.toLowerCase() === 's') {
+        console.log("input.type.toLowerCase()", input)
-            console.log("win.webContents.send(\"pushHotkeys\",\"CTRL+S\")")
+        if (input.control && input.key.toLowerCase() === 's' && input.type.toLowerCase() === "keydown" && input.isAutoRepeat === false) {
+            // if (input.type.toLowerCase()==="keydown"&& !okPush){
             win.webContents.send("pushHotkeys", "CTRL+S")
-            // event.preventDefault()
+            console.log("pushHotkeys", "CTRL+S", input.type)
+            // }
+            event.preventDefault()
         }
-        console.log('Pressed ',input.key)
+        // console.log('Pressed ',input.key)
         if (input.key.toUpperCase() === 'F5') {
             win.reload()
         }
         if (input.key.toUpperCase() === 'F12') {
-            if (win.webContents.isDevToolsOpened()){
+            if (input.type.toLowerCase() === "keydown") {
-                win.webContents.closeDevTools()
+                devToolPush = true;
             } else {
+                devToolPush = false;
+            }
+            if (win.webContents.isDevToolsOpened() && !devToolPush) {
+                win.webContents.closeDevTools()
+            }
+            if (!win.webContents.isDevToolsOpened() && !devToolPush) {
                 win.webContents.openDevTools()
             }
         }

package-lock.json

@@ -39,7 +39,7 @@
         "formik": "^2.2.9",
         "lexical": "^0.12.2",
         "localStorage": "^1.0.4",
-        "nanoid": "^4.0.1",
+        "nanoid": "^4.0.2",
         "prop-types": "^15.8.1",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",

package.json

@@ -29,7 +29,7 @@
     "formik": "^2.2.9",
     "lexical": "^0.12.2",
     "localStorage": "^1.0.4",
-    "nanoid": "^4.0.1",
+    "nanoid": "^4.0.2",
     "prop-types": "^15.8.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

src/App.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useId} from 'react';
 import routes from './routes'
 import {Outlet, useNavigate, useRoutes} from 'react-router-dom'
 import useIpcRenderer from '../src/utils/useIpcRenderer'

src/comment/TopMenu.js

@@ -68,6 +68,12 @@ exports.menuRebuild = (mainWindow) => {
                         })
                     }
                 },
+                {
+                    label: '保存文件',
+                    accelerator: 'Ctrl+S',
+                    click: () => { // console.log('Electron rocks!')
+                    }
+                },
                 {
                     label: '全部应用',
                     click: () => {

src/pages/Note/Hlexical/index.jsx

@@ -7,28 +7,19 @@ import {AutoFocusPlugin} from "@lexical/react/LexicalAutoFocusPlugin";
 import LexicalErrorBoundary from "@lexical/react/LexicalErrorBoundary";
 import TreeViewPlugin from "./plugins/TreeViewPlugin";
 import ToolbarPlugin from "./plugins/ToolbarPlugin";
-import {Button} from "antd";
 import {HeadingNode, QuoteNode} from "@lexical/rich-text";
 import {TableCellNode, TableNode, TableRowNode} from "@lexical/table";
 import {ListItemNode, ListNode} from "@lexical/list";
 import {CodeHighlightNode, CodeNode} from "@lexical/code";
 import {AutoLinkNode, LinkNode} from "@lexical/link";
-import {LinkPlugin} from "@lexical/react/LexicalLinkPlugin";
-import {ListPlugin} from "@lexical/react/LexicalListPlugin";
 import {MarkdownShortcutPlugin} from "@lexical/react/LexicalMarkdownShortcutPlugin";
 import {TRANSFORMERS} from "@lexical/markdown";
 import "./index.less"
-import ListMaxIndentLevelPlugin from "./plugins/ListMaxIndentLevelPlugin";
+import {useEffect, useId, useState} from 'react';
-import CodeHighlightPlugin from "./plugins/CodeHighlightPlugin";
-import AutoLinkPlugin from "./plugins/AutoLinkPlugin";
-import {useEffect, useState} from 'react';
 import {useLexicalComposerContext} from '@lexical/react/LexicalComposerContext';
 import {importFile, overWriteFile} from "../../../utils/File"
 import {CLEAR_HISTORY_COMMAND} from "lexical";
-import ActionPlugin from "../../../components/ActionPlug"
-import {func} from "prop-types";
 import store from "../../../redux/store";
-
 import {SAVE} from "../../../utils/HotkeyConst";
 import md5 from "md5"
 import {isEmpty} from "../../../utils/ObjectUtils";
@@ -85,43 +76,15 @@ function ImportFilePlugin(props) {
     }, [])
 }
 
-function SaveFilePlugin(props) {
-    useEffect(() => {
-        store.subscribe(() => {
-            console.log("触发保存")
-            let data = store.getState().pushHotkeys.data;
-            console.log("props.editorState",props.editorState)
-            if (isEmpty(props.editorState)){
-                return
-            }
-            const editorState = {"editorState":JSON.parse(props.editorState)};
-            let resultSave = JSON.stringify(editorState);
-            console.log("data === SAVE",data,SAVE,data === SAVE)
-            if (data === SAVE) {
-                importFile(props.filePath).then(value => {
-                    let save = md5(resultSave)!==md5(JSON.stringify(JSON.parse(value.toString())));
-                    console.log("md5(resultSave)!==md5(JSON.stringify(JSON.parse(value.toString())))",resultSave,save)
-                    if (save){
-                        console.log("保存重写")
-                        overWriteFile(props.filePath, resultSave)
-                    }
-                }).catch(error =>
-                    console.error(error)
-                )
-
-            }
-        })
-    }, props)
-}
 
 // 从字符串化 JSON 设置编辑器状态
 // const editorState = editor.parseEditorState(editorStateJSONString);
 // editor.setEditorState(editorState);
 
 export default function Hlexical(props) {
-    console.log("this.props.filePath:", props.filePath)
+    console.log("this.props.filePath=============:", props.filePath)
-    const [editorState, setEditorState] = useState();
+    const [editorState, setEditorState] = useState("");
-
+    const [lastId ,setLastId]= useState("");
     function onChange(editorState) {
         // Call toJSON on the EditorState object, which produces a serialization safe string
         const editorStateJSON = editorState.toJSON();
@@ -130,18 +93,19 @@ export default function Hlexical(props) {
         setEditorState(JSON.stringify(editorStateJSON));
     }
 
-    store.subscribe(() => {
+    function SaveFilePlugin(props) {
+        let unsubscribe = store.subscribe(() => {
             console.log("触发保存")
-        let data = store.getState().pushHotkeys.data;
+            console.log("props.editorState", props)
-        console.log("props.editorState",editorState)
+            if (isEmpty(props.editorState)) {
-        if (isEmpty(editorState)){
                 return
             }
-        const editorStateSave = {"editorState":JSON.parse(editorState)};
+            const editorStateSave = {"editorState": JSON.parse(props.editorState)};
-        console.log("editorStateSave",editorStateSave)
             let resultSave = JSON.stringify(editorStateSave);
-        console.log("data === SAVE",resultSave,data === SAVE)
+            console.log("store.getState().pushHotkeys", store.getState().pushHotkeys)
-        if (data === SAVE) {
+            console.log("lastId", lastId)
+            if ((lastId === "" || lastId !== store.getState().pushHotkeys.id) && store.getState().pushHotkeys.data === SAVE) {
+                setLastId(store.getState().pushHotkeys.id);
                 importFile(props.filePath).then(value => {
                     let save = md5(resultSave) !== md5(JSON.stringify(JSON.parse(value.toString())));
                     console.log("md5(resultSave)!==md5(JSON.stringify(JSON.parse(value.toString())))", resultSave, save)
@@ -152,9 +116,9 @@ export default function Hlexical(props) {
                 }).catch(error =>
                     console.error(error)
                 )
-
             }
-    })
+        });
+    }
 
     return (
         <LexicalComposer initialConfig={editorConfig}>
@@ -179,7 +143,7 @@ export default function Hlexical(props) {
                     <MarkdownShortcutPlugin transformers={TRANSFORMERS}/>
                     <OnChangePlugin onChange={onChange}/>
                     <ImportFilePlugin filePath={props.filePath}/>
-                    {/*<SaveFilePlugin filePath={props.filePath} editorState={editorState} />*/}
+                    <SaveFilePlugin filePath={props.filePath} editorState={editorState}/>
                     {/*<ActionPlugin/>*/}
                 </div>
             </div>

src/redux/pushHotkeys_reducer.js

@@ -1,15 +1,19 @@
 import { createSlice } from '@reduxjs/toolkit'
+import {nanoid} from "nanoid";
 
 export const pushHotkeysSlice = createSlice({
     name: 'pushHotkeys',
     initialState: {
-        data: ""
+        data: "",
+        id: nanoid()
     },
     reducers: {
         pushHotkeys: (state, action) => {
-            console.log("pushHotkeys:pushHotkeys", state, action)
+            console.log("pushHotkeys:pushHotkeys---------state", state)
+            console.log("pushHotkeys:pushHotkeys---------action", action)
             if(action.payload){
                 state.data = action.payload;
+                state.id = nanoid();
             }
         }
     }