不幸的是，设置-webkit-app-region: drag;会禁用所有的单击和鼠标事件，因为它被视为标题栏，所以你不能改变光标。
我会包括我读到的地方，但我再也找不到了。
参见：
#1354-webkit-app-region：拖动会吃掉所有点击事件
#8730无框电子应用程序不工作css光标：指针

是的，对不起，但有一个替代方案，工程与一些限制：
react-ts中的标题栏示例，一旦拖动开始，它就会发送鼠标移动：

function Header({ leading, navigation, following }: HeaderProps) {
  const navigate = useNavigate();
  const [, startTransition] = useTransition();
  const [dragging, setDragging] = useState(false);
  return (
    <div
      className="titleBar"
      onMouseDown={() => {
        setDragging(true);
      }}
      onMouseUp={() => {
        setDragging(false);
      }}
      onMouseLeave={() => {
        setDragging(false);
      }}
      onMouseMove={(e) => {
        if (dragging) {
          window.electron.ipcRenderer.sendMessage(
            'window',
            'move',
            e.movementX,
            e.movementY
          );
        }
      }}
    >
      <div className="flexrow_start">
        {leading}
        <div>
          {navigation.map((info, index) => (
            <button
              type="button"
              onClick={(e) => {
                e.preventDefault();
                startTransition(() => {
                  navigate(info.destination ?? '/');
                });
              }}
              key={index}
            >
              {info.content}
            </button>
          ))}
        </div>
      </div>
      {following !== undefined && (
        <div className="flexrow_end"> {following}</div>
      )}
    </div>
  );
}

字符串
在main.ts中：

ipcMain.on('window', (e, arg, arg2, arg3) => {
  switch (arg as string) {
    // comes from element added to header as element following routes
    case 'min':
      mainWindow?.minimize();
      break;
    // comes from element added to header as element following routes
    case 'max':
      if (mainWindow?.isMaximized()) {
        mainWindow.unmaximize();
      } else {
        mainWindow?.maximize();
      }
      break;
    // comes from element added to header as element following routes
    case 'close':
      app.quit();
      break;
    //header element dragging handler
    case 'move':
      console.log(arg2, arg3);
      mainWindow?.setPosition(
        mainWindow.getPosition()[0] + arg2,
        mainWindow.getPosition()[1] + arg3
      );
      break;
    default:
      break;
  }
});

.titleBar{
  height: 50px;
  display: flex;
  justify-content: space-between;

}
.titleBar:hover{
  cursor: grab;

}

编辑：当你在显示器之间移动电子应用程序时，它并不能很好地工作。如果有人对此有解决方案，我将非常感谢你的评论