一、简便的项目搭建
通过npm init来创建项目,如下图:
image.png
package name: (demoday2020-02-08--2) //创建的项目名
version: (1.0.0) //创建的版本号
description:
entry point: (index.js) //创建的入口文件
test command:
git repository:
keywords:
author:
license: (ISC)
About to write to D:\软件\Electron\DemoDay2020-02-08--2\package.json:
//创建的pacjage.json的内容
{
"name": "demoday2020-02-08--2",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
- 咱们现在能用到的也就只有我注释出来的几部分,其它的一路默认就好。
现在系统就将咱们需要的package.json文件给创建好了,咱们自己再手动创建以下index.js和index.html文件就好(文件名一定要跟package.json里面所指一样)。
我这里只是补充一下上篇文章所遗漏的只是,其实跟手动创建没多大区别。大家可以按爱好使用。
二、Electron中的事件
- 原生事件
- 就是Electron调用系统的api所调用的事件,如窗口事件、菜单事件
ready:页面加载完成是触发的事件
上篇文章已经讲过了ready的使用了,这里就不在赘述了。
closed:窗口关闭事件
image.png
因为closed是控制单个窗口关闭,所以就要再窗口所在函数里面调用
window-all-closed:所有的窗口关闭后触发的事件
image.png
因为window-all-closed是所有窗口关闭,所以写在全局
activate:窗口激活后触发的事件
image.png
窗口激活功能再windows系统中是没有的,再mac中是能使用的
image.png
之后再点击关闭查看命令行
image.png
会发现,程序执行了关闭的事件。
- Web事件
- 任何网页开发的事件都是,如按钮的点击事件
我相信大家能了解Electron,那么大家肯定都是有web基础的,所以web事件我就不再这里叙述了。