CSSポインタイベント - ドラッグを受け入れる、拒否クリック

Question

tldr;ドラッグ＆ドロップのポインタイベントを登録する要素が必要ですが、クリックやその他のポインタイベントをその背後の要素に渡します。

react-dropzoneを使用して、反応のドラッグアンドドロップ写真のアップロード機能を構築しています。 dropzoneがページ全体に表示されるようにしたいので、ファイルをページの任意の部分にドラッグすると、ページをドロップしてイメージをアップロードできます。 dropzoneはファイルがドラッグされていないときは透過的なので、後ろの要素に登録するにはクリックが必要です。

​​3210

しかし、pointer-events: none;が必要なドラッグを認識し、イベントを落とさないためにdropzoneが発生します。

は、これを実現するために、私はドロップゾーン・コンポーネントに次のスタイルを与えました。 dropzoneの背後にある要素に他のもの（クリックなど）を渡しながら、これらの特定のポインタイベントを認識する方法はありますか？

Answer 1

私は最近、同様の問題があり、dropzoneのz-indexを1に設定し、要素のz-indexを2に設定し、相対位置を使用して解決することができました。