electron dialog.showMessageBox的使用案例

 更新时间:2023年08月10日 10:08:46   作者:xjhqre  
Electron Dialog 模块提供了api来展示原生的系统对话框,本文主要介绍了electron dialog.showMessageBox的使用案例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

electron 版本:25.3.1

index.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

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

效果展示

到此这篇关于electron dialog.showMessageBox的使用案例的文章就介绍到这了,更多相关electron dialog.showMessageBox内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:

相关文章

  • vue 自定义提示框(Toast)组件的实现代码

    vue 自定义提示框(Toast)组件的实现代码

    这篇文章主要介绍了vue 自定义提示框(Toast)组件的实现代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-08-08
  • Vue的MVVM实现方法

    Vue的MVVM实现方法

    本篇文章主要主要介绍了Vue的MVVM实现方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • Element-ui中元素滚动时el-option超出元素区域的问题

    Element-ui中元素滚动时el-option超出元素区域的问题

    这篇文章主要介绍了Element-ui中元素滚动时el-option超出元素区域的问题,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-05-05
  • Vue项目利用axios请求接口下载excel

    Vue项目利用axios请求接口下载excel

    这篇文章主要为大家详细介绍了Vue项目利用axios请求接口下载excel,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-11-11
  • Vue3中如何使用v-model高级用法参数绑定传值

    Vue3中如何使用v-model高级用法参数绑定传值

    本文给大家介绍Vue3中使用v-model高级用法参数绑定传值的相关知识,包括单个输入框传值和多个输入框传值,一个组件接受多个v-model值,本文通过实例代码给大家介绍的非常详细,需要的朋友参考下吧
    2023-10-10
  • Vue 自定义组件 v-model 使用详解

    Vue 自定义组件 v-model 使用详解

    这篇文章主要介绍了Vue 自定义组件 v-model 使用介绍,包括vue2中使用和vue3中使用,本文通过示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-08-08
  • vue中跳转界面的3种实现方法

    vue中跳转界面的3种实现方法

    这篇文章主要给大家介绍了关于vue中跳转界面的3种实现方法,文中通过实例代码介绍的非常详细,对大家的学习或者工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-07-07
  • vue-model实现简易计算器

    vue-model实现简易计算器

    这篇文章主要为大家详细介绍了vue-model实现简易计算器,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-08-08
  • vue echarts实现航班选座案例分析

    vue echarts实现航班选座案例分析

    这篇文章主要介绍了vue echarts实现航班选座案例分析,代码是使用echarts来实现的,主要用到的是svg和自定义地图的相关知识,需要的朋友可以参考下
    2022-05-05
  • Intellij IDEA搭建vue-cli项目的方法步骤

    Intellij IDEA搭建vue-cli项目的方法步骤

    这篇文章主要介绍了Intellij IDEA搭建vue-cli项目的方法步骤,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-10-10

最新评论