From 9fda560ba330a37080b1ae4b11bc630d1bd67e3d Mon Sep 17 00:00:00 2001 From: shixiaohua Date: Wed, 24 Jan 2024 14:50:27 +0800 Subject: [PATCH] =?UTF-8?q?feat:=E5=BC=80=E5=A7=8B=E8=B7=B3=E8=BD=AC?= =?UTF-8?q?=E7=AC=94=E8=AE=B0=EF=BC=8C=E8=B7=B3=E8=BD=AC=E9=A6=96=E9=A1=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- main.js | 26 ++-------------- preload.js | 12 +++----- src/App.js | 13 +++++++- src/comment/FileDirOperate.mjs | 9 ------ src/comment/TopMenu.js | 5 +++ src/comment/renderer.js | 17 ---------- src/pages/GateWay/index.jsx | 53 ++++++++++++-------------------- src/redux/redirectUrl_reducer.js | 23 ++++++++++++++ src/redux/store.js | 6 ++-- src/routes/index.js | 16 ++-------- src/utils/useIpcRenderer.js | 18 +++++++++++ 11 files changed, 91 insertions(+), 107 deletions(-) delete mode 100644 src/comment/FileDirOperate.mjs delete mode 100644 src/comment/renderer.js create mode 100644 src/redux/redirectUrl_reducer.js create mode 100644 src/utils/useIpcRenderer.js diff --git a/main.js b/main.js index a518f7f..44e9820 100644 --- a/main.js +++ b/main.js @@ -1,13 +1,7 @@ // npm start -const { app,Menu, BrowserWindow , ipcMain } = require('electron') +const { app,Menu, BrowserWindow } = require('electron') const path = require('path') -const fs = require('fs') -const https = require('https') const {menuRebuild} = require('./src/comment/TopMenu.js') -const { fileHelper } = require('./src/utils/File/fileHelper'); - -const iconName = path.join(__dirname, 'iconForDragAndDrop.png') - const createWindow = () => { // Create the browser window. const win = new BrowserWindow({ @@ -15,8 +9,8 @@ const createWindow = () => { height: 600, webPreferences: { nodeIntegration:true, + // 启用后nodeIntegration会无效 contextIsolation:false, - preload: path.join(__dirname, 'preload.js') } }) @@ -25,28 +19,12 @@ const createWindow = () => { win.loadURL('http://localhost:3000') // 打开开发工具 win.webContents.openDevTools() - console.log('fileHelper',fileHelper) Menu.setApplicationMenu(Menu.buildFromTemplate(menuRebuild(win))) } -const ipcMainOn = () => { - // ipcMain.handle('ping', () => 'pong') - ipcMain.on('open-dir-result', (_event, value) => { - console.log(value) - }) - ipcMain.on('ondragstart', (event, filePath) => { - console.log(filePath) - event.sender.startDrag({ - file: path.join(__dirname, filePath), - icon: iconName - }) - }) -} - // 这段程序将会在 Electron 结束初始化和创建浏览器窗口的时候调用 // 部分 API 在 ready 事件触发后才能使用。 app.whenReady().then(() => { - ipcMainOn() createWindow() // 在 macOS 系统内, 如果没有已开启的应用窗口 // 点击托盘图标时通常会重新创建一个新窗口 diff --git a/preload.js b/preload.js index fabb4fa..b31d73f 100644 --- a/preload.js +++ b/preload.js @@ -1,10 +1,8 @@ // 预加载脚本 在上下文隔离渲染器进程中导入 Node.js 和 Electron 模块的概念 // 所有的 Node.js API接口 都可以在 preload 进程中被调用. // 它拥有与Chrome扩展一样的沙盒。 -const { contextBridge, ipcRenderer } = require('electron/renderer') -contextBridge.exposeInMainWorld('electronAPI', { - startDrag : (fileName) => ipcRenderer.send('ondragstart', fileName), - openDirectory : (callback) => - ipcRenderer.on('openDirectory', (_event, value) => callback(value)), - openDirectoryResult:(value) => ipcRenderer.send('open-dir-result', value) -}) \ No newline at end of file +const { ipcRenderer } = require('electron/renderer') +ipcRenderer.on('redirectUrl',(event,args) => { + console.log('event',event) + console.log('args',args) +}) diff --git a/src/App.js b/src/App.js index 62b5a80..7dca826 100644 --- a/src/App.js +++ b/src/App.js @@ -1,9 +1,20 @@ import React from 'react'; import routes from './routes' -import {Outlet, useRoutes} from 'react-router-dom' +import {Outlet, useNavigate, useRoutes} from 'react-router-dom' +import useIpcRenderer from '../src/utils/useIpcRenderer' function App() { + + let navigateFunction = useNavigate(); + function nativeTo(path){ + navigateFunction(path) + } + const redirectUrl =(event,args)=> { + nativeTo(args) + } + console.log("routes",routes) const element = useRoutes(routes) + useIpcRenderer({'redirectUrl':redirectUrl}) return ( <> {/* 注册路由 */} diff --git a/src/comment/FileDirOperate.mjs b/src/comment/FileDirOperate.mjs deleted file mode 100644 index 5f9d3ac..0000000 --- a/src/comment/FileDirOperate.mjs +++ /dev/null @@ -1,9 +0,0 @@ -// https://nodejs.org/docs/latest-v16.x/api/fs.html -import { readdir } from 'node:fs/promises'; -try { - const files = await readdir("/home/shixiaohua"); - for (const file of files) - console.log(file); -} catch (err) { - console.error(err); -} \ No newline at end of file diff --git a/src/comment/TopMenu.js b/src/comment/TopMenu.js index b860102..e7a68a9 100644 --- a/src/comment/TopMenu.js +++ b/src/comment/TopMenu.js @@ -54,6 +54,11 @@ exports.menuRebuild=(mainWindow)=> { }) } }, + {label:'全部应用', + click: () => { + mainWindow.webContents.send('redirectUrl', '/GateWay') + } + }, isMac ? { role: 'close' } : { role: 'quit' }, ] }, diff --git a/src/comment/renderer.js b/src/comment/renderer.js deleted file mode 100644 index 649b2ef..0000000 --- a/src/comment/renderer.js +++ /dev/null @@ -1,17 +0,0 @@ -// html中使用的js代码 之后用react替换 -document.getElementById('drag1').ondragstart = (event) => { - event.preventDefault() - window.electronAPI.startDrag('drag-and-drop-1.md') -} - -document.getElementById('drag2').ondragstart = (event) => { - event.preventDefault() - window.electronAPI.startDrag('drag-and-drop-2.md') -} - - -const openDir=document.getElementById('openDir'); -window.electronAPI.openDirectory ((value) => { - openDir.innerText = JSON.stringify(value) - window.electronAPI.openDirectoryResult('ok') -}) \ No newline at end of file diff --git a/src/pages/GateWay/index.jsx b/src/pages/GateWay/index.jsx index a094360..db8d691 100644 --- a/src/pages/GateWay/index.jsx +++ b/src/pages/GateWay/index.jsx @@ -1,43 +1,30 @@ -import React, { useState } from 'react'; -import { Col, Row, Slider } from 'antd'; -import { NavLink } from 'react-router-dom' +import React, {useState} from 'react'; +import {Col, Row, Slider} from 'antd'; +import {NavLink} from 'react-router-dom' import './index.less' -// const gutters = {}; -// const vgutters = {}; -// const colCounts = {}; -// [8, 16, 24, 32, 40, 48].forEach((value, i) => { -// gutters[i] = value; -// }); -// [8, 16, 24, 32, 40, 48].forEach((value, i) => { -// vgutters[i] = value; -// }); -// [2, 3, 4, 6, 8, 12].forEach((value, i) => { -// colCounts[i] = value; -// }); const GateWay = () => { - - const cols = []; - const colCount = 3; - let colCode = ''; + + const cols = []; + const colCount = 3; cols.push( - -
笔记
- , + +
笔记
+ , ); cols.push( - -
TODO
- , + +
TODO
+ , ); cols.push( - -
大乐透
- , + +
大乐透
+ , + ); + return ( + + {cols} + ); - return ( - - {cols} - - ); }; export default GateWay; \ No newline at end of file diff --git a/src/redux/redirectUrl_reducer.js b/src/redux/redirectUrl_reducer.js new file mode 100644 index 0000000..f946932 --- /dev/null +++ b/src/redux/redirectUrl_reducer.js @@ -0,0 +1,23 @@ +import { createSlice } from '@reduxjs/toolkit' + +export const redirectUrlSlice = createSlice({ + name: 'redirectUrl', + initialState: { + data: [] + }, + reducers: { + redirectUrlSync: (state, action) => { + console.log("redirectUrl:redirectUrlSync", state, action) + console.log(state) + console.log(action) + if(action.payload.length>0){ + // 路径跳转 + + } + + } + } +}) +export const { redirectUrlSync } = redirectUrlSlice.actions + +export default redirectUrlSlice.reducer diff --git a/src/redux/store.js b/src/redux/store.js index 93e63f9..7cce9c5 100644 --- a/src/redux/store.js +++ b/src/redux/store.js @@ -1,9 +1,11 @@ import { configureStore } from '@reduxjs/toolkit' import historyReducer from './historyRecord_reducer' +import redirectReducer from './redirectUrl_reducer' // 用于支持异步函数 // import thunk from 'redux-thunk' export default configureStore({ reducer: { - historyRecord:historyReducer + historyRecord:historyReducer, + redirectUrl:redirectReducer } - }) \ No newline at end of file +}) \ No newline at end of file diff --git a/src/routes/index.js b/src/routes/index.js index 6a3f015..9e51958 100644 --- a/src/routes/index.js +++ b/src/routes/index.js @@ -33,32 +33,20 @@ export default [ { path:'Hlexical', element: - }, - { - path:'sync', - element:, - }, - { - path:'probability', - element: - } + } ] }, { path:'/login', element:, }, - // { - // path:'/', - // element: - // } { path:'/GateWay', element:, }, { path:'/', - element: + element: }, ] \ No newline at end of file diff --git a/src/utils/useIpcRenderer.js b/src/utils/useIpcRenderer.js new file mode 100644 index 0000000..294461b --- /dev/null +++ b/src/utils/useIpcRenderer.js @@ -0,0 +1,18 @@ +import { useEffect } from 'react' +const { ipcRenderer } = window.require('electron') + + +const useIpcRenderer = (keyCallbackMap) => { + useEffect(() => { + Object.keys(keyCallbackMap).forEach(key => { + ipcRenderer.on(key, keyCallbackMap[key]) + }) + return () => { + Object.keys(keyCallbackMap).forEach(key => { + ipcRenderer.removeListener(key, keyCallbackMap[key]) + }) + } + }) +} + +export default useIpcRenderer \ No newline at end of file