创建 DragDropContext 时元素类型无效

Question

鉴于以下......

var root2 = <div />;

var AppDnD = ReactDnD.DragDropContext(ReactDnDMultiBackend.default(RDMBHTML5toTouch.default))(root2);

ReactDOM.render(root2, document.getElementById('content'));

我明白了...

Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components). Check the render method of DragDropContext(Component).

和...

Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. Check the render method of DragDropContext(Component)

警告中提到的 null 似乎是以下生成代码的结果...

React.createElement(AppDnD, null)

我该如何解决这个问题？

Javascript什么时候变得这么老练了？

库是基础...

   <script src="~/lib/ReactDnD.min.js"></script>
    <script src="~/lib/ReactDnDMultiBackend.min.js"></script>
    <script src="~/lib/RDMBHTML5toTouch.min.js"></script>

Answer 1

DragDropContext 想要组件而不是元素。

因此，例如，给定...

class MyComponent extends React.Component {

    render() {

        return (<div />);
    }
};

而不是...

var root2 = <MyComponent/>;

var AppDnD = ReactDnD.DragDropContext(ReactDnDMultiBackend.default(RDMBHTML5toTouch.default))(root2);

ReactDOM.render(root2, document.getElementById('content'));

...有人会...

var AppDnD = ReactDnD.DragDropContext(ReactDnDMultiBackend.default(RDMBHTML5toTouch.default))(MyComponent);

ReactDOM.render(<AppDnD />, document.getElementById('content'));

创建 DragDropContext 时元素类型无效

Element type is invalid when creating DragDropContext

javascript

reactjs

react-dnd