Electron save pop - yaokun123/php-wiki GitHub Wiki

保存对话框

dialog.showSaveDialog()

一、制作一个保存按钮

先在demo4.html中,编写一个按钮:

<button id="saveBtn">保存文件</button>

然后在<script>标签中加入下面的代码,这时候就可以顺利的弹出保存文件对话框了,我们可以随便写一个文件名,然后会在控制台给我们返回出来结果。

var saveBtn = document.getElementById('saveBtn')
    saveBtn.onclick = function(){
        dialog.showSaveDialog({
            title:'保存文件',

        }).then(result=>{
            console.log(result)
        }).catch(err=>{
            console.log(err)
        })
    }

其实我们还可以作的更多,比如我们引入Node中的fs模块,然后进行文件流的操作,就可以真的生成一个文件。

先引入fs模块。

const fs = require('fs')

然后在保存后,向文件里写入内容。

saveBtn.onclick = function(){
    dialog.showSaveDialog({
        title:'保存文件',
    }).then(result=>{
        console.log(result.filePath)
        fs.writeFileSync(result.filePath,'技术胖一个前端爱好者')
    }).catch(err=>{
        console.log(err)
    })
}

写完这一步就可以在终端中输入electron . 来打开应用,进行预览了。

⚠️ **GitHub.com Fallback** ⚠️