React-dnd: Uso de redux connect y react-dnd

Sí, puedes hacerlo así:

import { connect } from "react-redux";
import HTML5Backend from "react-dnd-html5-backend";
import { DragDropContext } from "react-dnd";

class App extends Component {
  ...
}

App = DragDropContext(HTML5Backend)(App);
export default connect(mapStateToProps)(App);

Siéntete libre de volver a abrir :).

ah, lo intentaré de esa manera también. ¿Usar flow también sería otro método aceptable?

import { DragDropContext } from 'react-dnd'
import HTML5Backend from 'react-dnd-html5-backend'
import flow from 'lodash/flow'

export default flow(
  connect(selector),
  DragDropContext(HTML5Backend)
)(ExperienceEditor);

¡Sí, eso también funcionaría!

Parece que no funciona para el back-end táctil ...
Lo intenté
Aplicación = DragDropContext (TouchBackend ({enableMouseEvents: true})) (Aplicación);
exportar conexión predeterminada (mapStateToProps, mapDispatchToProps) (Aplicación);
No estoy seguro de si debería publicar este problema aquí. Gracias.

@longmfe ¿cómo está importando App ?

@jnrepo Gracias por responder.
Solo lo importo
import App from ../../somepath/App.js
¿Debo agregar algo cuando lo use?
Por cierto, creo una aplicación como esta
import {connect} from react-redux
import {bindActionsCreators} from redux
class App extends Component {
}
App = DragDropContext(TouchBackend({ enableMouseEvents: true }))(App);
export default connect(mapStateToProps, mapDispatchToProps)(App);
Muchas gracias. Que tenga un lindo día.

Tengo un problema para envolver mi componente raíz con DragDropContext. En la consola obtengo:
Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's render method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner).

¿Alguna pista sobre qué podría estar causando este problema? No creo que esté incluyendo varias copias de React. Esto funcionaba perfectamente antes de envolver el componente raíz con DragDropContext. ¡Gracias!

Tengo root.js configurado como:
import { Component } from 'react';
import { DragDropContext } from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';

class Root extends Component {
render() {
return <div>
{React.cloneElement(this.props.children, this.props)}
</div>;
}
}

export default DragDropContext(HTML5Backend)(Root);

Y App.js como:
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import Root from './root';

function mapStateToProps(state) {
return {
...
}
}

function mapDispatchToProps(dispatch) {
return bindActionCreators({
...
}, dispatch)
}

const App = connect(mapStateToProps, mapDispatchToProps)(Root);

export default App;

La consola React presenta los componentes de esta manera ...