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

效果展示

相关推荐
_杨瀚博2 分钟前
微信支付集成_JSAPI
前端
polaris_tl3 分钟前
react beginwork
前端
亮子AI13 分钟前
【css】列表的标号怎么实现居中对齐?
前端·css
梦想的旅途237 分钟前
媒体文件(图片/文件)的上传与管理:获取 Media ID 的技术细节
前端·http·servlet
一水鉴天1 小时前
整体设计 定稿 之22 dashboard.html 增加三层次动态记录体系仪表盘 之1
前端·html
张拭心1 小时前
程序员越想创业,越不要急着动手
前端·人工智能
舒一笑1 小时前
在低配云服务器上实现自动化部署:Drone CI + Gitee Webhook 的轻量级实践
前端·后端·程序员
龙国浪子1 小时前
从零到一:打造专业级小说地图设计工具的技术实践
前端·electron
一水鉴天2 小时前
整体设计 定稿 之24+ dashboard.html 增加三层次动态记录体系仪表盘 之2 程序 (Q208 之2)
开发语言·前端·javascript
IT_陈寒2 小时前
Java 21新特性实战:这5个改进让我的代码效率提升40%
前端·人工智能·后端