electron-vue 仿网易云客户端(待完成)

electron-vue 仿网易云客户端

只完成了(我喜欢的音乐)页面

可以先看我之前的文章配置electron-vue https://blog.csdn.net/qq_42783610/article/details/85235282

核心重点:自定义导航条

electron-vue 仿网易云客户端(待完成)_第1张图片

主线程 

 mainWindow要设置frame:false

渲染线程 

-webkit-app-region: drag;   设置导航条拖拽,  -webkit-app-region: no-drag;设置导航条右上角的按钮不拖拽

 主和渲染线程的通信

主线程:

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

//添加ipcMain,并监听渲染进程触发。
ipcMain.on('window-min',() => {
    mainWindow.minimize()  //窗口最小化
  })
  ipcMain.on('window-max',() => {
    if (mainWindow.isMaximized()) {   //已经是最大化,就变为之前状态
          mainWindow.unmaximize()
    } else {
          mainWindow.maximize()  //窗口最大化
    }
  })
  ipcMain.on('window-close',() => {
    mainWindow.close()  //窗口关闭
  })

渲染线程:

window(action)
{
  this.$electron.ipcRenderer.send(`window-${action}`) //告诉主线程我要触发这个事件
  //this要指向vue
}

github地址:https://github.com/MRXKing/mrxkin_music

后台:https://github.com/MRXKing/mrxkin_music/tree/koa2

你可能感兴趣的:(electron-vue 仿网易云客户端(待完成))