Question

所以我开始将react dnd库集成到我的应用程序中，我尝试做的第一件事是添加带有Html5后端的DragDropContext。

当我将该属性添加到类时，我收到此错误：

未捕获错误：期望后端成为函数或ES6模块导出默认函数。

import React from 'react';
import Link from 'react-router-dom';
import { connect } from 'react-redux';
import { DragDropContext } from 'react-dnd';
import { HTML5Backend } from 'react-dnd-html5-backend';
import PropTypes from 'prop-types';

@DragDropContext(HTML5Backend)
class UserHowView extends React.Component {
  ...
  ..
}


const mapStateToProps = state => ({
 ...
});


export default connect(mapStateToProps)(userShowView);

到目前为止我做错了什么？

图书馆的一个例子有：

@DragDropContext(HTML5Backend)
export default class Container extends Component {

但我的定义和导出是分开的。

Answer 1

从HTML5Backend import语句中删除大括号。替换为以下内容：

import HTML5Backend from 'react-dnd-html5-backend';

这解决了我的问题。

Answer 2

此库自 v11.0.0 以来发生了重大变化breaking changes：

<块引用>

来自
import HTML5Backend from 'react-dnd-html5-backend
到
import { HTML5Backend } from 'react-dnd-html5-backend

如果您仍然遇到问题，请查看此issue in repo 并确保您的渲染函数中没有包含 DragDropContext

添加DragDropContext会导致导出ES6模块时出错

2 个答案: