窗口

新窗口

# 新窗口中加载web内容

// frontend/src/views/os/window/Index.vue
<script>
  let viewContent = {
        type: 'web',
        content: 'https://www.bilibili.com/',
        windowName: 'window-web',
        windowTitle: 'bilibili'
  },
  createWindow (index) {
    this.$ipc.invoke(ipcApiRoute.createWindow, viewContent).then(r => {
      console.log(r);
    })
  },
</script>

// electron/controller/os.js
/**
 * 打开新窗口
 */
createWindow(args) {
  const { type, content, windowName, windowTitle } = args;
  let contentUrl = null;
  if (type == 'html') {
    contentUrl = path.join('file://', electronApp.getAppPath(), content)
  } else if (type == 'web') {
    contentUrl = content;
  } else if (type == 'vue') {
    let addr = 'http://localhost:8080'
    if (Ps.isProd()) {
      const mainServer = Conf.getValue('mainServer');
      addr = mainServer.protocol + mainServer.host + ':' + mainServer.port;
    }
    contentUrl = addr + content;
  } else {
    // some
  }
  console.log('contentUrl: ', contentUrl);
  const addonWindow = this.app.addon.window;
  let opt = {
    title: windowTitle
  }
  const win = addonWindow.create(windowName, opt);
  const winContentsId = win.webContents.id;
  // load page
  win.loadURL(contentUrl);
  return winContentsId;
}

// Make sure to add code blocks to your code group

# 新窗口中加载html内容

// frontend/src/views/os/window/Index.vue
<script>
  let viewContent = {
        type: 'html',
        content: '/public/html/view_example.html',
        windowName: 'window-html',
        windowTitle: 'html window'
  },
  createWindow (index) {
    this.$ipc.invoke(ipcApiRoute.createWindow, viewContent).then(r => {
      console.log(r);
    })
  },
</script>

// electron/controller/os.js
// 同上

// Make sure to add code blocks to your code group

# 新窗口中加载当前项目页面

// frontend/src/views/os/window/Index.vue
<script>
  let viewContent = {
        type: 'vue',
        content: '/#/special/subwindow',
        windowName: 'window-vue',
        windowTitle: 'vue window'
  },
  createWindow (index) {
    this.$ipc.invoke(ipcApiRoute.createWindow, viewContent).then(r => {
      console.log(r);
    })
  },
</script>

// electron/controller/os.js
// 同上

// Make sure to add code blocks to your code group

# 完整代码

上次更新: 2025/06/06, 07:21:49

← 视图桌面通知→