说明：该例子主要实现把输入框中的文字保存到本地的文本文档中。

在main中添加几句代码

const ipcMain = electron.ipcMain;

const dialog = electron.dialog;
ipcMain.on("openDir", function (e) {

    var fileName = dialog.showOpenDialog(mainWindow, {title: "选择一个目录", properties: ["openDirectory"]});

    e.returnValue = fileName ? fileName : null;

});

这段代码防止文件没有名字而出错

html代码

 <!DOCTYPE html>

 <html>

 <head>

     <meta charset="UTF-8">

     <title>Hello World!</title>

 </head>

 <body>

 <button id="btn-select-dest-dir">选择保存的目录</button>

 <form id="form-data">

     <div>

         <textarea name="txt" style="width: 300px;height: 200px" required="required"></textarea>

     </div>

     <div>

         <input type="submit" value="保存">

     </div>

 </form>

 </body>

 <script>

     // You can also require other files to run in this process

     require('./renderer.js')

 </script>

 </html>

renderer代码

 // This file is required by the index.html file and will

 // be executed in the renderer process for that window.

 // All of the Node.js APIs are available in this process.

 const {ipcRenderer}=require("electron");

 const fs = require("fs");

 class Renderer {

     constructor() {

         this.btnSelectDestDir = document.getElementById("btn-select-dest-dir");

         this.formSaveData = document.getElementById("form-data");

         this.addListeners();

     }

     addListeners() {

         var self = this;

         this.btnSelectDestDir.onclick = function () {

             var files = ipcRenderer.sendSync("openDir");

             if (files && files.length) {

                 self.destDir = files[0];

             }

         };

         this.formSaveData.onsubmit = function (e) {

             e.preventDefault();

             if (!self.destDir) {

                 alert("请选择要保存的目录");

                 return;

             }

             var destFile = `${self.destDir}/data.txt`;

             fs.writeFile(destFile, this["txt"].value, function (err) {

                 if (!err) {

                     alert(`成功保存文件${destFile}`);

                 } else {

                     alert("无法保存文件");

                 }

             })

         };

     }

 }

 new Renderer();

运行即可

补充：在main.js里面的

可以修改运行文件的路径。。。

electron小例子的更多相关文章

  1. springmvc入门的第一个小例子

    今天我们探讨一下springmvc,由于是初学,所以简单的了解一下 springmvc的流程,后续会持续更新... 由一个小例子来简单的了解一下 springmvc springmvc是spring框 ...

  2. java即时通信小例子

    学习java一段时间了,今天写来一个即时通信的小例子练手在其过程中也学到了一些知识拿出来和大家分享,请路过的各位大神多多赐教... 好了下面讲一下基本的思路: 首先,编写服务器端的程序,简单点说吧就是 ...

  3. Runtime的几个小例子（含Demo）

    一.什么是runtime(也就是所谓的“运行时”,因为是在运行时实现的.)           1.runtime是一套底层的c语言API(包括很多强大实用的c语言类型,c语言函数);  [runti ...

  4. bootstrap 模态 modal 小例子

    bootstrap 模态 modal  小例子 <html> <head> <meta charset="utf-8" /> <title ...

  5. INI配置文件分析小例子

    随手写个解析INI配置字符串的小例子 带测试 #include <iostream> #include <map> #include <string> #inclu ...

  6. JavaScript小例子：复选框全选

    JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...

  7. 【zTree】 zTree使用的 小例子

    使用zTree树不是第一次了  但是 还是翻阅着之前做的 对照着 使用起来比较方便  这里就把小例子列出来   总结一下使用步骤 这样方便下次使用起来方便一点 使用zTree树的步骤: 1.首先  在 ...

  8. js小例子（标签页）

    运用js写的一个小例子,实现点击不同的标签出现不同的内容: <!DOCTYPE html> <html> <head> <meta chaset=" ...

  9. sbrk与brk的使用小例子

    sbrk() 和 brk() - Unix的系统函数   sbrk()和brk() 系统的底层会维护一个位置,通过位置的移动完成内存的分配和回收.映射内存时 以一个内存页作为基本单位.   void* ...

随机推荐

  1. 我的android学习经历30

    数据存储的持久化技术 数据存储主要有五种方式: (1)文件存储或者SD卡 (2)SharedPreferences (3)SQLite (4)ContentProvider (5)网络存储 下面简单介 ...

  2. .Net面試4套

    一 1. 面向对象的思想主要包括什么? 答: 继承,多态,封装,类,对象,接口,聚集,聚合,泛化 2. 什么是ASP.net中的用户控件 答: 用户控件就是使用.ascx作为扩展名的文件,其将多种服务 ...

  3. BZOJ 2568 比特集合

    题目链接:http://www.lydsy.com:808/JudgeOnline/problem.php?id=2568 题意:维护一个集合S,支持以下操作: (1)INS M : 将元素 M 插入 ...

  4. bzoj 3118: Orz the MST（单纯形）

    题目链接:http://www.lydsy.com:808/JudgeOnline/problem.php?id=3118 题意:给出一个图以及图中指定的n-1条边组成的生成树.每条边权值加1或者减去 ...

  5. SQL多条件查询安全高效比较

    ALTER PROCEDURE _tmp @ID VARCHAR(50), @PN VARCHAR(50), @Type INT AS BEGIN /************************* ...

  6. Java中静态和非静态的区别

    在网上看到的,感觉还不错,自己笔记下来,以后忘了方便看: 非静态方法是相对于静态方法来说的.静态方法使用static关键字来标示,非静态方法没有此关键字. 他们之间最大的区别在于它们生命周期的不同,静 ...

  7. 6.Type and Member Basics

    1.The Different Kinds of Type Members 1.Constants:a symbol that identifies a never-changing data val ...

  8. C# 文件流相关操作

    二进制转换成图片: MemoryStream ms = new MemoryStream(bytes); ms.Position = ; Image img = Image.FromStream(ms ...

  9. poj 1696 Space Ant （极角排序）

    链接:http://poj.org/problem?id=1696 Space Ant Time Limit: 1000MS   Memory Limit: 10000K Total Submissi ...

  10. phpcms 在后台增加了一个模型的话，在数据库中就会相应的增加数据库表

    在phpcms后台管理系统中,我们如果增加一个新的模型的话,例如名为:测试模型,英文名:test 在添加完成后,我们在数据库中发现增加了两个数据表:v9_test,v9_test_data;