WebKit2_41环境下拖拽组件透明度不生效问题咨询

环境信息 #

• 系统：Linux Mint x64
• 桌面应用：基于Golang，使用WebKit2_41（Wails框架）
• 前端框架：React
• CSS框架：TailwindCSS

我采用Wails（Golang桌面框架）结合Pragmatic DND简化拖拽API交互。拖拽开始时，通过以下代码修改组件透明度：

const myComponent = () => {
  const [dragging, setDragging] = useState(false);

  return (
    <div
      className={`group flex items-center w-full rounded-md bg-background ${dragging ? "opacity-50" : ""}`}
      ref={listCardRef}
    ></div>
  );
}

这段代码在Chromium系浏览器及Firefox中正常工作，但在Wails框架使用的WebKit2中仅部分生效：原组件透明度可正常改变，但拖拽生成的快照透明度未变化。

效果对比 #

• 实际效果（WebKit2环境）：拖拽触发后，原组件变为半透明，但跟随鼠标的拖拽快照保持完全不透明状态
• 预期效果（Chrome环境）：拖拽触发后，原组件和拖拽快照均变为半透明状态

内容的提问来源于stack exchange，提问作者Harsh k