モバイル デバイスを使用しているとき、または Chrome デバイスのツールバーでページを表示しているときに、HeadlessUI ポップアップ メニューをクリックしようとすると問題が発生します。通常のデスクトップブラウザモードでは問題なく動作するようです。私はコード サンドボックスで数時間をかけてテストし、コードを最も単純な形式に絞り込みました。これは、ここで表示およびデモできます:
https://codesandbox.io/s/react-tailwind-rive-animation-tap-issue-bxlt95?file=/src/App.js
これはコードの関連部分です:
リーリークリックしたときにブラウザで通常のようにメニューがポップアップしない原因を突き止めようとしています。よろしくお願いいたします。
以前、別のフォーラムで誰かが私の質問に答えました。問題は、私の div がクリックをキャプチャしますが、それをアニメーションに渡さないことです。メニュー アイコンの周囲の div に
style={{ pointerEvents: "none" }}
を追加すると、再び動作し始めました。