慕课网electron写音乐播放器教程,代码跟随教程变动(二)
上次代码中,可以发现构建两个进程的代码几乎一样,若需要渲染的进程有很多,对于以下这个代码块会出现多次使用,如果每次都去复制粘贴显然不现实
mainWindow = new BrowserWindow({ width: 900, height: 600, webPreferences: { preload: path.join(__dirname, 'preload.js'), nodeIntegration:true//设置此项以使用nodejs }, frame:false })
因此使用一个封装类来进行代码复用
class AppWindow extends BrowserWindow{//自定义创建窗口的封装类,继承于BrowserWindow constructor(config, fileLocation){ const basicConfig = { width: 900, height: 600, webPreferences: { preload: path.join(__dirname, 'preload.js'), nodeIntegration:true//设置此项以使用nodejs }, frame:false } const finalConfig1 = Object.assign(basicConfig, config)//将传入的对象和原来的对象合并 const finalConfig = { ...basicConfig, ...config}//也可以这样写(ES6语法) super(finalConfig)//调用父类的constructor this.loadFile(fileLocation)//调用当前类 //不懂的去看super和this的区别 } }
此时只需要这样调用
mainWindow = new AppWindow({}, './renderer/index.html') const addWindow = new AppWindow({ width:500, height:400, parent:mainWindow }, './renderer/ad.html')
同时使用ready-to-show进行一个优化,在AppWindow中添加
this.once('ready-to-show', ()=>{ this.show() })