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()
    }
})

效果展示

相关推荐
Cassie燁5 分钟前
el-button源码解读1——为什么组件最外层套的是Vue内置组件Component
前端·vue.js
vx_bscxy3225 分钟前
告别毕设焦虑!Python 爬虫 + Java 系统 + 数据大屏,含详细开发文档 基于web的图书管理系统74010 (上万套实战教程,赠送源码)
java·前端·课程设计
北极糊的狐6 分钟前
Vue3 子组件修改父组件传递的对象并同步的方法汇总
前端·javascript·vue.js
spionbo6 分钟前
Vue3 前端分页功能实现的技术方案及应用实例解析
前端
Zyx20077 分钟前
JavaScript 作用域与闭包(下):闭包如何让变量“长生不老”
javascript
AI绘画小337 分钟前
Web 安全核心真相:别太相信任何人!40 个漏洞挖掘实战清单,直接套用!
前端·数据库·测试工具·安全·web安全·网络安全·黑客
7***n7510 分钟前
前端设计模式详解
前端·设计模式·状态模式
u***j32411 分钟前
JavaScript在Node.js中的进程管理
开发语言·javascript·node.js
用户479492835691517 分钟前
Vite 中 SVG 404 的幕后黑手:你真的懂静态资源处理吗?
前端·vite
用户479492835691520 分钟前
javascript新进展你关注了吗:TC39 东京会议带来五大新特性
javascript