React-dnd: Nesting and ownership of React DnD backends

Created on 17 Aug 2015 · 7Comments · Source: react-dnd/react-dnd

Is there a handle to already established backends/DragDropContext? I'm using your code from #186:

let defaultManager;
function getDefaultManager() {
    if (!defaultManager) {
        defaultManager = new DragDropManager(HTML5Backend);
    }
    return defaultManager;
}

But is there a way to check if another application has created a manager?

design decisions wontfix

Source

jaygood

Most helpful comment

@gaearon

Whenever I try to do this I keep getting

DragDropManager.js:40 Uncaught TypeError: createBackend is not a function

Any idea what could be causing this? I have the exact same code as @jaygood with DragDropManager imported from dnd-core and HTML5Backend imported from the correct library.

akhayoon on 12 Jul 2016

👍10

All 7 comments

Nesting backends is not thought out well now. If you'd like to propose an API change to make it more explicit I'm happy to hear it!

gaearon on 17 Sep 2015

I'm using a modified version of DragDropContext which simply uses the above getDefaultManager where the childContext is declared like so:

    const childContext = {
        dragDropManager: getDefaultManager(backend)
    };

this is working beautifully for me with a nested drag & drop card layout, but I admittedly haven't taken the time to review all the implications of this approach yet

jpollard-cs on 15 Mar 2016

@gaearon

Whenever I try to do this I keep getting

DragDropManager.js:40 Uncaught TypeError: createBackend is not a function

Any idea what could be causing this? I have the exact same code as @jaygood with DragDropManager imported from dnd-core and HTML5Backend imported from the correct library.

akhayoon on 12 Jul 2016

👍10

@akhayoon @gaearon After updating React DND (and also React HTML5 Backend) from 2.6 to 5.0, I'm getting this error as well.

bureson on 8 Aug 2018

@bureson hello, im facing this issue as well, any workaround?

JJie09 on 4 Sep 2018

@JJie09 you will need to change the way how you import the lib, one of following:

import HTML5Backend from "react-dnd-html5-backend"
const HTML5Backend = require('react-dnd-html5-backend').default;

bureson on 8 Oct 2018

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.