問題タブ [react-dnd]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
react-dnd - React DnD は、ドラッグ時にのみ div スタイルを変更します
ライブラリを使用してドラッグ アンド ドロップ メカニズムを実装していますreact-dndが、ドロップ ターゲットのスタイルを設定するのが難しいと感じています。ドロップできるドロップターゲットをユーザーに表示したいのですが、 and を使用するisOverと、canDrop現在ホバーされているアイテムのみがスタイル設定されます。
この値を使用する!isOverと、要素をドラッグしなくても、すべての div がスタイル設定されます。要素のドラッグが発生したときにのみ
、ドロップ ターゲットのスタイルを設定するにはどうすればよいですか?
これは、これまでの私のコードです。 @DropTarget
isDragging要素がページ上でドラッグされているときに値を取得する方法はありますか?これが私が望むものを取得する唯一の可能性であるためです。
ありがとう！
react-dnd - canDrop() の結果を確認する
私は dragSource のタイプを持っています、それを と呼びましょうCard、そして dropTarget Stacks。スタックはたくさんありますが、それぞれのカードをすべてにドロップすることはできません。したがって、StackのcanDropメソッドで、Cardドラッグされていることを取得し、いくつかの比較を実行して、そのカードをドロップできるかどうかを返します。
では、ここまでは順調です。Cardユーザーが a を間違った にドロップしようとするとStack、canDropfalse が返され、何も起こりません。
私の質問は、ドロップ アクションが失敗したときに、「理由により、このカードをここにドロップすることはできません」のようなメッセージを表示したいということです。を使用してそれを行うにはどうすればよいreact-dndですか? からの結果を使用できませんcanDrop。ドロップが発生したことがないため、処理されないのですか? カードを目的のにcanDrop移動する関数にロジックを移動することもできますが、その場合、 aを a にドロップできることのみを指定し、特定のスタックにカードをドロップできるかどうかのすべてのロジックはコードによって処理されます。 .Stackreact-dndCardStack
これは正しいです？私が見ていないライブラリを使用してこれを行う他の方法はありますか? これにはどのようなアプローチが良いでしょうか？