mac端 electron-vue 的 tray事件触发不了？

Question

mac端 electron-vue 的 tray事件触发不了

• chatFor/trayProblem/src/main/index.js
• index.js

import {
  app,
  BrowserWindow,
  BrowserView,
  globalShortcut,
  dialog,
  Menu,
  ipcMain,
  Tray,
  screen,
  nativeImage,
} from "electron";
const isDev = require("electron-is-dev");
const menuTemplate = require('./menu')
const Store = require('electron-store')
const path = require('path')
import {loginStore} from '../tool/storage'
import ipcMainFun from '../tool/ipcMain'
import {newWindow} from './AppWindow'



// const windowStateKeeper = require('electron-window-state');
/**
 * Set `__static` path to static files in production
 * https://simulatedgreg.gitbooks.io/electron-vue/content/en/using-static-assets.html
 */
if (process.env.NODE_ENV !== 'development') {
  global.__static = require('path').join(__dirname, '/static').replace(/\\/g, '\\\\')
}


let mainWindow,loginWindow
let MAINURL = 'http://localhost:9080'
const winURL = process.env.NODE_ENV === 'development'
  ? MAINURL
  : `file://${__dirname}/index.html`
// let win;
let tray = null
  
  
function createWindow() {
  
  console.log(__static,'23333')

  // 设置原生应用菜单
  let menu = Menu.buildFromTemplate(menuTemplate.template)
  Menu.setApplicationMenu(menu)
  /**
   * Initial window options
   */
  // BrowserWindow.removeDevToolsExtension("Console");
  // BrowserWindow.removeDevToolsExtension("console");

  // 保持窗口大小固定
  // let mainWindowState = windowStateKeeper({
  //   defaultWidth: 1000,
  //   defaultHeight: 800
  // });
  // 'x': mainWindowState.x,
  // 'y': mainWindowState.y,
  // 'width': mainWindowState.width,
  // 'height': mainWindowState.height,

  // width: 470,
  // height: 800,

  mainWindow = new BrowserWindow({
    // width: 470,
    // height: 800,
    width: 1000,
    height: 700,
        useContentSize: true,
        webPreferences: {
            nodeIntegration: true, // 添加这一配置
        },
    devTools: false,
    show: true
  });
  
  // mainWindow.setResizable(false) // 用户是否可以手动调整窗口大小。

  mainWindow.setTitle('aabb')
  // mainWindow.getNormalBounds()

  mainWindow.loadURL(winURL);
  // let installed = BrowserWindow.getDevToolsExtensions()
  // console.log(installed);

  const view = new BrowserView();
  mainWindow.on('resize', ()=>{
    // console.log('resizezzzzz')
    
  })
  // 
  // console.log('关闭主窗口')
  mainWindow.on('close', (event) => {
      if (process.platform === 'darwin') {
          // 回收BrowserWindow对象
          event.preventDefault()
          mainWindow.hide()
        } else {
          mainWindow.hide()
          mainWindow.setSkipTaskbar(true)
          event.preventDefault()
        }

  });
  // console.log('关闭主窗口')
  mainWindow.on('closed', () => {
    console.log('23333close')
    loginWindow = null;
    mainWindow = null;
  
  })
  // win.isVisible() ? win.hide() : win.show();
  

  // 生产环境
  // if (!isDev) {
  //   mainWindow.webContents.closeDevTools();
  //   // 快捷键禁用打开控制台
  //   globalShortcut.register("CommandOrControl+Shift+I", () => {
  //     // let focusWin = BrowserWindow.getFocusedWindow()
  //     // focusWin && focusWin.toggleDevTools()
  //     console.log("globalShortcut");
  //   });
  //   globalShortcut.register("CommandOrControl+Option+I", () => {
  //     // let focusWin = BrowserWindow.getFocusedWindow()
  //     // focusWin && focusWin.toggleDevTools()
  //     console.log("tiaoshi2");
  //   });
  // }
  // createLoginWins()
  console.log('23333为了居中之前')
  ipcMainFun(mainWindow,loginWindow)
  
  
  // console.log('每次重新打开也是走的这里')
  console.log('23333333！每次重新打开也是走的这里')
  // 崩溃重启
  // reLive(mainWindow);

  // let size = screen.getPrimaryDisplay().workAreaSize
  // let width = parseInt(size.width * 1)
  // let height = parseInt(size.height * 1)
  // loginStore.set("width",width)
  // loginStore.set("height",height)
  
  // console.log('屏幕宽高',width,height)
  // if(loginStore.get("isLogin")){
  //   loginWindow.setSize(1000, 700)
  //   loginWindow.center()
  // }else{
  //   loginWindow.setSize(470, 800)
  //   loginWindow.center()
  // }

  console.log('23333居中',loginStore.get("isLogin"))
  if(loginStore.get("isLogin")){
    mainWindow.setSize(1000, 700)
    mainWindow.center()
    mainWindow.setResizable(true)
  }else{
    mainWindow.setSize(470, 800)
    mainWindow.center()
    mainWindow.setResizable(false)
    console.log('23333为了居中')
  }

}





//...
// 第二个实例打开时执行的程序
app.on('second-instance', (event, argv) => {
  dialog.showMessageBox({
    title: "second",
    message: "second:" + argv.join(""),
  });
  console.log('argv: ',argv)
});
app.on('ready', ()=>{
  createWindow();
  handleTray()
})

app.on('before-quit',()=>{
  console.log('强制退出前！！！')
})
app.on('quit',()=>{
  console.log('强制退出前！！！')
})

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    console.log('强制退出！！！')
    app.quit()
  }
})

app.on('activate', () => {
  if (mainWindow === null) {
    createWindow()
  }
})


// 崩溃重启
function reLive(mainWindowS){
  // const mainWindowS = BrowserWindow.fromId(global.mainId);
  mainWindowS.webContents.on('crashed', () => {
    const options = {
        type: 'error',
        title: '进程崩溃了',
        message: '这个进程已经崩溃.',
        buttons: ['重载', '退出'],
      };    
    recordCrash().then(() => {
        dialog.showMessageBox(options, (index) => {
          if (index === 0) reloadWindow(mainWindowS);
          else app.quit();
        });
      }).catch((e) => {
        console.log('err', e);
      });
  })

  function recordCrash() { 
      return new Promise(resolve => { 
        // 崩溃日志请求成功.... 
        resolve();
      })
  }
    
  function reloadWindow(mainWin) {
    if (mainWin.isDestroyed()) {
      app.relaunch();
      app.exit(0);
    } else {
      BrowserWindow.getAllWindows().forEach((w) => {
        if (w.id !== mainWin.id) w.destroy();
      });
      mainWin.reload();
    }
  }
}



/**
 * Auto Updater
 *
 * Uncomment the following code below and install `electron-updater` to
 * support auto updating. Code Signing with a valid certificate is required.
 * https://simulatedgreg.gitbooks.io/electron-vue/content/en/using-electron-builder.html#auto-updating
 */

/*
import { autoUpdater } from 'electron-updater'

autoUpdater.on('update-downloaded', () => {
  autoUpdater.quitAndInstall()
})

app.on('ready', () => {
  if (process.env.NODE_ENV === 'production') autoUpdater.checkForUpdates()
})
 */
function handleTray(){
  console.log('设置托盘')
  let timer = null
  let count = 0
  if (process.platform === 'darwin') {
    tray = new Tray(nativeImage.createEmpty());
    // tray.setImage();
    const imgages = nativeImage.createFromPath(path.resolve(__dirname, '../../build/icons/icon.ico'))
    imgages.setTemplateImage(true)
    // imgages.isMacTemplateImage(true)
    tray = new Tray(imgages)
  }else{
    tray = new Tray(`${__static}/icon.ico`)
  }

  const contextMenu = Menu.buildFromTemplate([
      {
          label: '退出',
          click: function(){
              app.quit();
          }
      }
  ]);

  tray.setContextMenu(contextMenu);
  tray.setToolTip('应用标题');

  // 任务栏点击事件
  // let timeCount = 0
  // tray.on('click', function (Event) {
  //   setTimeout(() => {
  //     if (timeCount === 0) {
  //       console.log('单机事件11111111')
  //       timeCount = 0
  //     }
  //   }, 300)
  // })
  

  tray.on('click',function(){
    mainWindow.show();
  })
  // tray.on('left-click',function(){
  //   mainWindow.show();
  // })
  // tray.on('right-click',(e,b,p)=> {
  //   console.log('2333click')
  //   console.log(e,b,p)
  //   mainWindow.show();
  //   // mainWindow.setSkipTaskbar(false);
  // })

  if (mainWindow) {
    if (mainWindow.isMinimized()) mainWindow.restore()
    if (process.platform !== 'darwin') {
      mainWindow.show()
      mainWindow.setSkipTaskbar(false)
    }
    mainWindow.focus()
  }


}


 let createLoginWins = () => {

      Menu.setApplicationMenu(null) // 关闭子窗口菜单栏
      const modalPath = process.env.NODE_ENV === 'development'
        ? `${MAINURL}/#/login`
        : `file://${__dirname}/index.html#login`
    // 使用hash对子页面跳转，这是vue的路由思想
      // loginWindow = new BrowserWindow({
      //   width: 600,
      //   height: 400,
      //   webPreferences: {
      //     webSecurity: false
      //   },
      //   parent: mainWindow // mainWindow是主窗口
      // })
      loginWindow = new newWindow({
        width: 470,
        height: 800,
        webPreferences: {
            nodeIntegration: true,
        },
        parent: mainWindow,
        devTools: false,
      })
      loginWindow.setResizable(false)
      loginWindow.loadURL(modalPath)

      loginWindow.on('closed', () => {
        // 登录窗口的处理 关闭登陆窗口需要设置mainWindow = null
        mainWindow = null
        loginWindow = null
      })
      
}

需求是登录登出并改变窗口大小且居中显示

ipcmain.js

import {
    BrowserWindow,
    ipcMain
} from "electron";

let mainWindow = new BrowserWindow({
// 'x': mainWindowState.x,
// 'y': mainWindowState.y,
// 'width': mainWindowState.width,
// 'height': mainWindowState.height,
height: 750,
width: 1000,
    useContentSize: true,
    webPreferences: {
        nodeIntegration: true, // 添加这一配置
    },
    devTools: false
});

ipcMain.on('synchronous-message', (event, arg) => {
    if (arg === 'center') {

        mainWindow.center()
        console.log("window 居中显示")

        // mainWindowState.manage(mainWindow);

    }
})

ipcRenderer.js

let {ipcRenderer} = window.require('electron')
export const ipcTowCenter = () => {
    return new Promise(resolve => {
        ipcRenderer.send('synchronous-message', "center")
        resolve()
        // ipcRenderer.on('asynchronous-reply', (event, result) => {
        //     resolve(result);
        // })
    });
}

进入登录界面时调用

import {ipcTowCenter,ipcToResize} from '../../../tool/ipcRenderer.js'

this.$once("hook:mounted", () => {
     // 进入页面不让调整窗口
    //ipcToResize(false).then(()=>{})
    ipcTowCenter().then(()=>{})
});

如果不hide之后登入登出 都会报上面的弹窗错误
electron 版本是 v7.3.3

git 地址在 https://github.com/cc-electro...
希望大佬帮助一下，，谢谢了~

Answer 1

https://segmentfault.com/q/10...

登陆和主要进程窗口分为了两个页面

github: https://github.com/cc-electro...