React-dnd: monitor.isDragging() gibt manchmal false zurück, wenn es true zurückgeben sollte

@amoenk Ja, wir benötigen Beispielcode, um Ihnen zu helfen.

Danke für Ihre Hilfe! Hier ist das Arbeitsbeispiel: http://notlouieagain.com/~amoenk/dnd/

Und dieser Link zum Durchsuchen des entbündelten Codes: http://notlouieagain.com/~amoenk/dnd/js/

Oh, ich habe beim Debuggen auch den ursprünglichen einfachen sortierbaren Democode eingefügt, aber die wichtigen Komponenten sind Ingredient und IngredientGroup.

Ich habe mir Ihren Code angesehen und kann die Komponente DnDStudy nicht finden. Können Sie mir Ihren vollständigen Code zeigen und nur Ihren. Sie können den Democode entfernen.

Democode entfernt, DnDStudy-Komponente ist hier eine Seitenkomponente: http://notlouieagain.com/~amoenk/dnd/js/pages/DnDStudy.react.js

Ok, ich habe nachgesehen und glaube, dass es ein Problem sein könnte, weil die Schlüssel IngredientGroup in DnDStudy . Anstatt sich auf den Index des Arrays zu verlassen, versuchen Sie es mit einer eindeutigen ID ähnlich der von Ingredient innerhalb von IngredientGroup .

Code aktualisiert, aber immer noch das gleiche Problem.

In Ordnung. Da lag ich falsch.

@gaearon kannst du helfen?

Damit isDragging im Komponentenbaum funktioniert, implementieren Sie bitte manuell isDragging in Ihrer Drag-Quelle.

const ingredientSource = {
    beginDrag(props) {
        return { ingredient: props.ingredient };
    },
    isDragging(props, monitor) {
        return props.ingredient === monitor.getItem().ingredient;
    }
};

Siehe DragSource Dokumente :

isDragging(props, monitor) : Optional. Standardmäßig wird nur die Ziehquelle, die den Ziehvorgang initiiert hat, als Ziehen betrachtet. Sie können dieses Verhalten überschreiben, indem Sie eine benutzerdefinierte isDragging Methode definieren. Es könnte etwas wie props.id === monitor.getItem().id . Tun Sie dies, wenn die Originalkomponente während des Ziehens ausgehängt und später mit einem anderen Elternteil „wiederbelebt“ wird. Wenn Sie beispielsweise eine Karte über die Listen in einem Kanban-Board verschieben, möchten Sie, dass sie das gezogene Erscheinungsbild behält – obwohl die Komponente technisch gesehen ausgehängt und jedes Mal eine andere angebracht wird, wenn Sie sie in eine andere Liste verschieben. _Hinweis: Sie dürfen monitor.isDragging() innerhalb dieser Methode nicht aufrufen._

Hilft das?

Funktioniert perfekt! Das muss in der Dokumentation übersehen worden sein.

Danke für deine Hilfe! Ich schließe das Ticket.

Kein Problem. Freue mich zu helfen.

meh! Links zu http://notlouieagain.com/ reagieren nicht ...

Ich habe die Ursache meines Problems gefunden. Ich musste aufhören, den DragDropContextProvider zu verwenden, um meine DropTargets und DragSources zu umschließen. Siehe das Beispiel unten.
http://react-dnd.github.io/react-dnd/docs-drag-drop-context-provider.html

export default class YourApp {
    render() {
        return (
            <DragDropContextProvider backend={HTML5Backend}>
                /* ... */
            </DragDropContextProvider>
        )
    }
}

Stattdessen musste ich den DragDropContext verwenden, um meine gesamte Klasse wie unten beschrieben zu umschließen.
http://react-dnd.github.io/react-dnd/docs-drag-drop-context.html

class YourApp {
    /* ... */
}
export default DragDropContext(HTML5Backend)(YourApp)

Das hat das Problem bei mir sofort behoben.