Modern usage of sortable is not working for me

[dineshvgp]

I have changed the DemoItem.js as follows:

import React from 'react';
import { sortable } from '../../src/index.js';

@sortable
class DemoItem extends React.Component {
  render() {
    return (
      <div className={this.props.className}>
        {this.props.children}
      </div>
    );
  }
};

export default DemoItem;

The above one doesn't work for me. Please correct me if I'm doing something wrong.

[jasonslyvia]

As the docs states, you have to destructure this.props to your item to assign some event handlers passed by Sortable.

import React from 'react';
import { sortable } from '../../src/index.js';

@sortable
class DemoItem extends React.Component {
  render() {
    const { className, ...rest } = this.props;
    return (
      <div className={this.props.className} {...rest}>   // <-- here
        {this.props.children}
      </div>
    );
  }
};

export default DemoItem;

[dineshvgp]

Oh I haven't read the docs well. Thanks, this works great!!