I am trying to create a list of dropdowns which can be reordered by dragging them. For drag and drop i am using react-sortable-hoc. Here i am attaching a working sample. Link for sample
To reproduce the issue, Select value in first dropdown by mouse or keyboard. after that drag that element (first dropdown) and drop it at 3rd or 4th position then you observed that dropped dropdown will not persist the value. Selected value displayed at first element. What could be the cause for this? How can i fix it?
You need to pass onSortEnd handler to your srotableContainer as props
<List items={this.state.items} onSortEnd={this.onSortEnd}/>;
I also suggest you add a key on your Item
<Item key={item} data={item} index={index} />
Here is the forked sandbox where it is working: https://codesandbox.io/s/adoring-raman-l72xw?fontsize=14