electron 版本號 v15.3.0
第一步
新建demo7.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>
激活碼:<span id="code">激活碼123123123123</span>
<button id="btn">復制激活碼</button>
</div>
</body>
<script>
const {clipboard} = require('electron')
var code = document.getElementById('code')
var btn = document.getElementById('btn')
btn.onclick = function(){
clipboard.writeText(code.innerHTML)
alert('復制成功!')
}
</script>
</html>
第二步
修改main.js
var electron = require('electron') // 加載全局electron
const {ipcMain, Menu,BrowserWindow, BrowserView} = require('electron')
var globalShortcut = electron.globalShortcut
var app = electron.app // 引用 app
// var BrowserWindow = electron.BrowserWindow // 窗口引用
var mainWindow = null // 聲明要打開的主窗口
app.on('ready',()=>{
mainWindow = new BrowserWindow({
width:1200,
height:1200,
webPreferences: {
nodeIntegration: true, //設置開啟nodejs環(huán)境
contextIsolation: false,
enableRemoteModule:true
}
}); // 設置主窗口大小
require('@electron/remote/main').initialize()
require('@electron/remote/main').enable(mainWindow.webContents)
require('./main/Menu.js')
// mainWindow.webContents.openDevTools() // 啟動打開調(diào)試器
mainWindow.loadFile('demo7.html') //加載html 頁面
globalShortcut.register('ctrl+e', () => {
mainWindow.loadURL('http://www.itdecent.cn/u/e9a31a3c3bdb')
})
let isRegister = globalShortcut.isRegistered('ctrl+e')? 'register sucess!' : 'register fail!'
console.log(isRegister)
// BrowserView
// const view = new BrowserView()
// mainWindow.setBrowserView(view)
// view.setBounds({
// x:0,
// y:150,
// width:800,
// height:800
// })
// view.webContents.loadURL('http://www.itdecent.cn/u/e9a31a3c3bdb')
mainWindow.on('closed',()=>{
mainWindow = null
})
})
// main show-menu 自定義名稱，與demo2.js中的名稱保持一致
ipcMain.on('show-menu', (event) => {
const template = [
{
label: '復制',
// type: 'checkbox', checked: true 選中的菜單前面會有√
type: 'checkbox', checked: true,
// 點擊事件 調(diào)用方法 menu-method1 與 demo2.js 中 ipcRenderer.on('menu-method1') 為對應關(guān)系
click: () => { event.sender.send('menu-method1', '123213') }
},
// type: 'separator' 分割線 加上之后兩個按鈕之間有一條分割線
{ type: 'separator' },
{ label: '粘貼'}
]
const menu = Menu.buildFromTemplate(template)
menu.popup(BrowserWindow.fromWebContents(event.sender))
})
第三步
驗證測試
electron .
點擊按鈕出現(xiàn)彈窗，去其他地方進行ctrl + v的操作查看是否完成該功能
image.png
image.png
紅色是本次修改或新增的內(nèi)容
image.png
