Sortable

排序组件

Props

属性

类型

说明

items

[array]

排序组件列表

onSortEnd

[function]

排序组件排序方法

import { SortableContainer, SortableElement, arrayMove } from 'react-sortable-hoc';
sortableList() {
    const SortableItem = SortableElement(({ value }) =>
      <li>{value}</li>);

    const SortableList = SortableContainer(({ items }) => (
      <ul>
        {items.map((value, index) => (
          <SortableItem key={`item-${value}`} index={index} value={value} />
        ))}
      </ul>
    ));
    return <SortableList items={this.state.items} 
      onSortEnd={({ oldIndex, newIndex }) => 
      { this.onSortEnd({ oldIndex, newIndex }); }} />;
}

<div className="sort-able eg-wrapper">
  {this.sortableList()}
</div>

Last updated

Was this helpful?