react-anything-sortable: Doesn't work with mapped SortableItems

This works:

render() {
  return <Sortable>
      <DemoHOCItem className="item-1" sortData="react" key={1}>
        React
      </DemoHOCItem>
     <DemoHOCItem className="item-2" sortData="angular" key={2}>
        Angular
      </DemoHOCItem>
    </Sortable>
}

This doesnt:

function renderItem(n, index) {
return <DemoHOCItem
      className={'item-' + index}
      sortData={n}
      key={index}>{n}</DemoHOCItem>
}

render() {
  return <Sortable>
     {items.map(renderItem)}
 </Sortable>
}

And by doesn’t work, I mean nothing is rendered within sortable.

If I render the {items.map(renderItem)} outside of <Sortable>, it works…

Very odd.

About this issue

  • Original URL
  • State: open
  • Created 8 years ago
  • Reactions: 2
  • Comments: 15 (9 by maintainers)

Most upvoted comments

Alright then, I will test it myself.