cocos creator 笔记-electron

编译器版本 3.5.2，electron版本 12.0.0，vue-electron版本 1.0.6。

场景：点击按钮，弹出windows窗口，内嵌html页面。

cocos creator中，项目，构建发布，web桌面端，生成文件。

electron中，按钮事件

            start(){
				let win=this.electronWindow.getters.getElectronWindow
				if(win){
					return;
				}
				const BrowserWindow = this.electron.remote.BrowserWindow;
				this.cocosView = new BrowserWindow({
					webPreferences: {
						webSecurity: false,
						nodeIntegration: true,
						webviewTag: true,
						contextIsolation: false,
						enableRemoteModule:true
					},
					transparent: true,
					resizable: false,
					frame:false,//是否显示边缘框
					fullscreen:true,//是否全屏显示
					width:this.width,
					height:this.height,
					y:0,
					x:0,
					backgroundColor: '#fff',
					center:true,
					alwaysOnTop:true,
				})
				this.cocosView.webContents.openDevTools();
				let url=window.location.protocol+"//"+window.location.host+"/#/gamePack"
				this.cocosView.loadURL(url)
			}

在跳转后的gamePack文件中,使用webview标签加载html文件,里面是可以正常监听到cocos中的输入事件。

			<el-button @click="close" class="no-drag hover-color btn-clz" size="mini" type="text">
				<i class="btn el-icon-close"></i>
			</el-button>
			<el-button @click="fullscreen" class="no-drag btn-clz"  size="mini" type="text" >
				<i class="btn el-icon-full-screen" v-if="fullscreenState"></i>
				<i class="btn el-icon-copy-document" v-else-if="!fullscreenState"></i>
			</el-button>		
        <div>
			<webview :src="path" style="width: 100%;height: 100vh;" class="no-drag">         </webview>
		</div>

created () {			
            this.win=window.require('electron').remote.getCurrentWindow()
			this.path = url
},
		methods: {
			fullscreen(){
				this.fullscreenState=!this.fullscreenState
				if(this.fullscreenState) {
					this.win.setFullScreen(true)
				}else {
					this.win.setFullScreen(false)
					this.win.setSize(this.width/4,this.height/4)
				}
			},
			close(){
				if(this.win&&this.win.id!=1){
					this.win.close()
				}
			},
		}