双击样式为“ -webkit-app-region：拖动；”的元素最大化窗口会导致“最大化”按钮不变的错误

Question

我正在使用电子来开发软件。我有一个无框窗户。我自己使用CSS代码“ -webkit-app-region：drag;”创建了一个标题栏，并且有一个“最大化” /“未最大化”按钮。问题是，当我双击标题栏时，窗口会最大化，但是“最大化” /“未最大化”按钮不会改变。我尝试使用ipc进行通信，但是仍然存在问题。问题是，单击“最大化”按钮后，窗口将最大化，但是当我双击“拖动区域”时，它将触发窗口的“最大化”信号。我们知道，当我双击“拖动区域”时，普通软件应该触发“未最大化”。

main.js： `

  win.on('maximize', () => {
    win.webContents.send('maximize-app-window')
  })
  win.on('unmaximize', () => {
    win.webContents.send('unmaximize-app-window')
  })

`

renderer.js： `

  <div v-if="maximizeType === 'maximize'"
      class="icon-checkbox-unchecked" @click="maximizeAppWindow()"></div>
  <div v-else
      class="icon-window-restore-o" @click="unmaximizeAppWindow()"></div>

...(vue component code)
  data: function () {
    return {
      maximizeType: 'maximize'
    }
  },
  methods: {
    maximizeAppWindow () {
      this.maximizeType = 'unmaximize'
      ipcRenderer.send('maximize-app-window')
    },
    unmaximizeAppWindow () {
      this.maximizeType = 'maximize'
      ipcRenderer.send('unmaximize-app-window')
    },
  },

...
mounted() {
  ipcRenderer.on('maximize-app-window', (event) => {
    this.maximizeType = 'unmaximize'
  })
  ipcRenderer.on('unmaximize-app-window', (event) => {
    this.maximizeType = 'maximize'
  })
}

`