Electron: ¿Cómo mostrar el cuadro de diálogo de confirmación antes de la descarga?

Creado en 22 jul. 2015  ·  3Comentarios  ·  Fuente: electron/electron

El evento beforeunload en Electron actúa de manera diferente que en el navegador. Si devuelvo una cadena, no se muestra en un cuadro de diálogo de confirmación. Vi que en BrowserWindow das un ejemplo del uso de beforeunload y en él mencionas en un comentario que es posible mostrar un cuadro de diálogo de confirmación:

// También puede usar la API de diálogo para permitir que el usuario confirme el cierre de la aplicación

¿No está disponible la API de diálogo solo para el proceso principal?
¿Cuál es la forma más sencilla de replicar el comportamiento normal del navegador?

Comentario más útil

@shneorasa Sé que han pasado unos meses desde que preguntaste (y probablemente ya hayas encontrado una solución), pero para aquellos que buscan una solución en el futuro, aquí hay una mejor manera de manejar este problema en lugar de usar window.onbeforeload .

El evento beforeunload que se sobrescribe puede estropear los diálogos futuros y romper la aplicación. En su lugar, puede almacenar un booleano simple dentro de su aplicación como lo he hecho yo:

// Inside main/index.js
import { app, BrowserWindow, dialog } from 'electron'
app.showExitPrompt = true

Con eso, puede interrumpir el evento close de su BrowserWindow siguiente manera:

// Inside main/index.js, where BrowserWindow is initialized
mainWindow.on('close', (e) => {
    if (app.showExitPrompt) {
        e.preventDefault() // Prevents the window from closing 
        dialog.showMessageBox({
            type: 'question',
            buttons: ['Yes', 'No'],
            title: 'Confirm',
            message: 'Unsaved data will be lost. Are you sure you want to quit?'
        }, function (response) {
            if (response === 0) { // Runs the following if 'Yes' is clicked
                app.showExitPrompt = false
                mainWindow.close()
            }
        })
    }
})

Implementé esta solución en una aplicación de Electron usando Vue.js, y mostrar / ocultar el diálogo es tan simple como importar app :

const { app } = require('electron').remote

y sobrescribiendo el valor booleano almacenado:

app.showExitPrompt = true

Todos 3 comentarios

No importa. Me lo imaginé.

Para referencia futura, aquí hay un ejemplo:

window.onbeforeunload = function(e) {
    var remote = require('remote');
    var dialog = remote.require('dialog');
    var choice = dialog.showMessageBox(
            remote.getCurrentWindow(),
            {
                type: 'question',
                buttons: ['Yes', 'No'],
                title: 'Confirm',
                message: 'Are you sure you want to quit?'
            });

    return choice === 0;
};

Hola(:
la solución mencionada anteriormente no funciona para mí.
porque todavía se necesita "onbeforeunload" del navegador ...
¿alguna idea?

@shneorasa Sé que han pasado unos meses desde que preguntaste (y probablemente ya hayas encontrado una solución), pero para aquellos que buscan una solución en el futuro, aquí hay una mejor manera de manejar este problema en lugar de usar window.onbeforeload .

El evento beforeunload que se sobrescribe puede estropear los diálogos futuros y romper la aplicación. En su lugar, puede almacenar un booleano simple dentro de su aplicación como lo he hecho yo:

// Inside main/index.js
import { app, BrowserWindow, dialog } from 'electron'
app.showExitPrompt = true

Con eso, puede interrumpir el evento close de su BrowserWindow siguiente manera:

// Inside main/index.js, where BrowserWindow is initialized
mainWindow.on('close', (e) => {
    if (app.showExitPrompt) {
        e.preventDefault() // Prevents the window from closing 
        dialog.showMessageBox({
            type: 'question',
            buttons: ['Yes', 'No'],
            title: 'Confirm',
            message: 'Unsaved data will be lost. Are you sure you want to quit?'
        }, function (response) {
            if (response === 0) { // Runs the following if 'Yes' is clicked
                app.showExitPrompt = false
                mainWindow.close()
            }
        })
    }
})

Implementé esta solución en una aplicación de Electron usando Vue.js, y mostrar / ocultar el diálogo es tan simple como importar app :

const { app } = require('electron').remote

y sobrescribiendo el valor booleano almacenado:

app.showExitPrompt = true
¿Fue útil esta página
0 / 5 - 0 calificaciones