React-sortable-hoc: Items being set to visibility: hidden, opacity: 0
Hi folks, i have set up my project following the docs (only executing a console log for the onSortEnd function for now). When i try to drag an item i'm only ever able to grab the first one and the rest disappear. Looking at dev tools, all the other items are given an inline of visibility: hidden, opacity: 0.
I've seen people have had zindex issues with disappearing elements when using bootstrap but im not :/
Have i done something obviously wrong??
Sami.
sami616
All 4 comments
Hi,
I just had the same problem and resolved it by adding index prop to SortableElement HOC. index prop is required as per docs.
```javascript
const SortableItem = SortableElement(({ item }) => {
return (
{item}
);
}
);
items.map((item, index) =>
hitman99
on 22 Jun 2017
@sami616 I'm not sure what the issue you're describing is, I'd need to see the code. Are you able to share a fiddle?
clauderic
on 17 Jul 2017
Use hideSortableGhost={false} on SortableContainer
GaurabendwithB
on 16 May 2018
For future reference.
If your item is disappeared when sorting, it is already noted in README
https://github.com/clauderic/react-sortable-hoc#item-disappearing-when-sorting--css-issues
sunhohong
on 7 Sep 2018
Related issues
arackaf
路
3Comments
ccharliemagne
路
3Comments
botoxparty
路
3Comments
zaygraveyard
路
3Comments
ncammarata
路
4Comments
Most helpful comment
Hi,
I just had the same problem and resolved it by adding index prop to SortableElement HOC. index prop is required as per docs.
```javascript
const SortableItem = SortableElement(({ item }) => {
return (
{item}
);
}
);
items.map((item, index) =>