electron electron-vue创建子窗口

只能通过主线程创建窗口

1、配置路由,在router/index.js中配置好窗口对应的路由

2、在main/index.js主线程中创建窗口
	function openVip()
		var xx = new BrowserWindow({
		    width: 400,
		    height: 550,
		    x:n,  位移
		    y:n,  位移
		    parent: mainWindow, 
		    frame:false,  是否显示默认工具栏
		    webPreferences: {
		        nodeIntegration: true
		    }
		})
		  xx.loadURL(winURL+'#/router配置的path路径');
		  xx.on('closed', () => { vipWin = null })
	}

3、操作子窗口
	开启:
		通过主线程和渲染进程的通信,在主线程中对窗口进行自定义操作
			ipcMain.on('openVip', e =>
			  openVip()
			);
	关闭放大缩小等:
		方式一:通过主进程和渲染进程通信,在主进程关闭
		方式二:在当前进程的窗口关闭,remote.getCurrentWindow().close();

代码示例:
主进程

import { app, BrowserWindow,ipcMain } from 'electron'

/**
 * 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
const winURL = process.env.NODE_ENV === 'development'
  ? `http://localhost:9080`
  : `file://${__dirname}/index.html`

function createWindow () {
  /**
   * Initial window options
   */
  mainWindow = new BrowserWindow({
    height: 670,
    useContentSize: true,
    width: 1020,
    frame:false,
    webPreferences:{
      // devTools:false
    }

  })

  mainWindow.loadURL(winURL)

  mainWindow.on('closed', () => {
    mainWindow = null
  })
}

// 开启vip新窗口

function openVip()
{
  var vipWin = new BrowserWindow({
    width: 400,
    height: 550,
    parent: mainWindow, // win是主窗口
    // frame:false,
    webPreferences: {
        nodeIntegration: true
    }
})
  vipWin.loadURL(winURL+'#/vip');
  // vipWin.loadURL("https://bilibili.com/")
  // vipWin.loadFile('../renderer/pages/openVip/index.vue')
  vipWin.on('closed', () => { vipWin = null })
}

ipcMain.on('openVip', e =>
  openVip()
);


app.on('ready', createWindow)

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

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

/**
 * 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()
})
 */

渲染进程:

showWindow()
{
    ipcRenderer.send('openVip')
}

路由:

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'home',
      component: require('@/pages/home').default,
      meta:{
        showTop:true
      }
    },
    {
      path: '/vip',
      name: 'vip',
      component: require('@/pages/openVip').default,
      meta:{
        showTop:false
      }
    },
  ]
})