electron dialog.showMessageBox使用案例

electron 版本:25.3.1

index.html

html 复制代码
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';"/>
</head>
<body>
<h1>Hello World!</h1>
<button id="sad">点我弹出消息对话框</button>
<script>
    const {ipcRenderer} = require('electron')
    document.querySelector('#sad').addEventListener('click', () => {
        ipcRenderer.send('open-message-dialog')
    })
</script>
</body>
</html>

main.js

js 复制代码
const {app, BrowserWindow, ipcMain, dialog} = require('electron')

function createWindow() {
    let win = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            nodeIntegration: true,
            contextIsolation: false
        }
    })

    win.loadFile('index.html')

    ipcMain.on('open-message-dialog', () => {
        dialog.showMessageBox({
            title: '消息',
            message: '这是一个消息框。',
            type: 'info',
            buttons: ['确定', '取消']
        })
    })
}

app.whenReady().then(createWindow)


app.on('window-all-closed', function () {
    if (process.platform !== 'darwin') app.quit()
})

app.on('activate', () => {
    if (BrowserWindow.getAllWindows().length === 0) {
        createWindow()
    }
})

效果展示

相关推荐
小磊哥er7 分钟前
【前端工程化】前端组件模版构建那些事
前端
前端 贾公子8 分钟前
monorepo + Turborepo --- 开发应用程序
java·前端·javascript
江城开朗的豌豆12 分钟前
Vue路由传参避坑指南:params和query的那些猫腻
前端·javascript·vue.js
十里青山20 分钟前
超好用的vue图片预览插件更新啦,hevue-img-preview 7.0.0版本正式发布,支持vue2/vue3/移动/pc,增加缩略图、下载、自定义样式等
前端·javascript·vue.js
lichenyang45329 分钟前
css模块化以及rem布局
前端·javascript·css
小熊哥^--^31 分钟前
条件渲染 v-show与v-if
前端
棉花糖超人38 分钟前
【从0-1的CSS】第3篇:盒子模型与弹性布局
前端·css·html
小小小小宇8 小时前
虚拟列表兼容老DOM操作
前端
悦悦子a啊8 小时前
Python之--基本知识
开发语言·前端·python
安全系统学习9 小时前
系统安全之大模型案例分析
前端·安全·web安全·网络安全·xss