dialog.messageBox组件

dialog.messageBox 组件是 electron 的原生组件，在不同系统中的样式不同，本文主要介绍在 win10 下的显示效果

文章目录

dialog.messageBox组件
一、dialog.messageBox组件调用
二、使用
- 1. 基本样式
- 2. 自定义样式

一、dialog.messageBox组件调用

const{dialog} = require("electron")
或
import {dialog} from "electron"

二、使用

1. 基本样式

代码如下（示例）：

 dialog.showMessageBox({type: 'info',title: '提示信息',defaultId: 0,message:"确定要退出登录吗？",buttons:['取消','确定']},(index) => {if(index === 0){//取消按钮事件            }else{//确定按钮事件}});

效果如下：

2. 自定义样式

自定义消息提示框样式，可以添加自定义图标，改变按钮样式为大众比较能接受的样式
代码如下（示例）：

dialog.showMessageBox({type: 'info',noLink:true, // 按钮并列显示在右下角title: '提示信息',icon:path.join(__static,"./zero.ico"), // 自定义提示消息图标defaultId: 0,message:"确定要退出登录吗？",buttons:['取消','确定']
},(index) => {if(index === 0){//取消按钮事件            }else{//确定按钮事件}
});

效果如下：

Electron-vue dialog.messageBox 组件使用相关推荐

Vue组件封装 ——dialog对话框组件
一.基础准备工作 1.创建一个基础的vue项目包 2.创建components文件夹,用于存放组件,新建dialog.vue组件,可以自己取个名字 <script> export def ...
editor修改样式 vue_手摸手Electron + Vue实战教程（三）
系列文章: 手摸手Electron + Vue实战教程(一) 手摸手Electron + Vue实战教程(二) ❝ 上一篇我们已经完成了左侧菜单栏的基本样式功能,这一篇我们就主要来开发右侧的Markd ...
android仿微信图片编辑器,electron/vue可编辑框contenteditable|仿微信截图
基于Electron+vue实现div可编辑contenteditable插入表情|electron-vue截图功能为了避免使用 vue 手动建立起 electron 应用程序.electron-v ...
【PPic】基于Electron+Vue+iView的图床应用设计
其实这个应用并不是那么的特别需求,一来本人写blog越来越少,二来开发工作也是越做越少,再者目前的编辑器几乎都支持直接剪切板上传图片,使图床应用的场景越来越少.不过本人本着不想丢弃技术的内心想法,以及 ...
VUE优秀UI组件库（PC和Mobile）
引用: https://my.oschina.net/u/3219445/blog/1573155 随着SPA.前后端分离的技术架构在业界越来越流行,前端的业务复杂度也越来越高,导致前端开发者需要管理 ...
Vue 开发的组件库
16款优秀的Vue UI组件库推荐 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可. 在公司的Web前端项目开发中,多个项目采用 ...
electron vue点击按钮关闭_electron+vue制做桌面应用--自定义标题栏最大/小化和关闭...
上一篇:electron+vue制做桌面应用--自定义标题栏中咱们介绍了如何使用electon制做自定义样式的标题栏接下来,咱们介绍一下标题栏上的最大化.最小化和关闭按钮如何实现vue 首先查阅el ...
Electron+Vue的开发经验
搭建Electron+vue项目以及运行和打包过程中遇到的问题搭建Electron+Vue项目安装Vue脚手架与创建vue项目运行过程中的问题 Q1:启动项目用时长且报如下错误 Q2:在使用no ...
VUE常用UI组件插件及框架-vue前端UI框架收集
UI组件及框架 element - 饿了么出品的Vue2的web UI工具套件 mint-ui - Vue 2的移动UI元素 iview - 基于 Vuejs 的开源 UI 组件库 Keen-UI - ...

Electron-vue dialog.messageBox 组件使用

dialog.messageBox组件

文章目录

一、dialog.messageBox组件调用

二、使用

1. 基本样式

2. 自定义样式

Electron-vue dialog.messageBox 组件使用相关推荐

最新文章

热门文章