Electron使用小技巧

1,626 阅读1分钟

####一、electron的菜单快捷键

accelerator:"自定义快捷键组合",前提是要自定义方法事件

进行注册全局快捷键时,快捷键要大写 ----》Ctrl+X

const { app, globalShortcut } = require("electron");
app.on("ready", () => {
// 注册一个 'CommandOrControl+X' 的全局快捷键
	const ret = globalShortcut.register("Ctrl+X", () => {
	console.log("Ctrl+X is pressed");
});
	if (!ret) {
		console.log("registration failed");
	}
// 检查快捷键是否注册成功
	console.log(globalShortcut.isRegistered("Ctrl+X"));
});
app.on("will-quit", () => {
// 注销快捷键
	globalShortcut.unregister("Ctrl+X");
	// 注销所有快捷键
	globalShortcut.unregisterAll();
});
复制粘贴
const { remote, clipboard } = require("electron");

clipboard.writeText(ddp.innerHTML)   ----》复制内容

clipboard.readText()    ---》粘贴的内容

二、打印功能

BrowserWindow.getFocusedWindow().webContents.print();

三、监听网络变化

window.addEventListener('online', function(){});  --有网络
window.addEventListener('offline', function(){}); --断开网络

四、实现消息通知

const option = {
title: 'title',
body: 'body',
icon: path.join('main-process/favicon2.ico')
}
const myNotification = new window.Notification(option.title,option);
myNotification.onclick = () =>{
console.log('clicked');
}

五、隐藏掉顶部的菜单

1、在主进程中加入 mainWindow.setMenu(null)
2 、electron-vue 中 中 隐藏闭 关闭 化 最大化 最小化按钮
mainWindow = new BrowserWindow({
	height: 620,
	useContentSize: true,
	width: 1280
	frame: false /*去掉顶部导航 去掉关闭按钮 最大化最小化按钮*/
})

var { ipcMain, BrowserWindow } = require("electron");

//获取当前窗口对象 BrowserWindow.getFocusedWindow();
var mainWindow = BrowserWindow.getFocusedWindow();

electron-vue  自定义闭 关闭 化 最大化  最小化按钮
	ipc.on('window-min',function(){
		mainWindow.minimize();
	})
//登录窗口最大化
	ipc.on('window-max',function(){
		if(mainWindow.isMaximized()){
			mainWindow.restore();   --还原
		}else{
			mainWindow.maximize();
		}
	})
	ipc.on('window-close',function(){
		mainWindow.close();
	})

六、electron-vue 自定义导航可拖拽

可拖拽的 css: -webkit-app-region: drag; 不可拖拽的 css: -webkit-app-region: no-drag;

--注意,当外层添加拖拽后,里层添加点击事件时,点击事件的元素要添加这个样式方能添加点击事件