反应可排序，特别当我拖动的元素

Question

的jsfiddle列表中消失：https://jsfiddle.net/40vpaLj5/

我GOOGLE了一些问题，我发现的唯一消失的相关问题是，当人们用它在一个模式和他们谈设置Z-索引来解决它。无论如何，我仍然尝试过。我怎样才能解决这个问题？

import React from 'react'; 
import PlaylistPages from './PlaylistPages'; 

class PlaylistSortableComponent extends React.Component { 
    constructor(props, context) { 
    super(props, context); 

    this.state = { 
     test: [ 
     '1','2', '3', '4' 
     ] 
    } 
    } 

    render() { 
    return (
     <PlaylistPages pages={this.state.test} style={{zIndex: 999999}} /> 
    ); 
    } 
} 


const PlaylistPages = SortableContainer(({pages}) => { 
    return (
    <div> 
     { 
     pages.map((page, index) => 
      <PlaylistPage key={index} page={page} style={{zIndex: 99999999}} /> 
    )} 
    </div> 
); 
}); 

const PlaylistPage = SortableElement(({page}) => { 
    return (
    <div style={{zIndex: 99999999}} >{page}</div> 
); 
}); 

Answer 1

每个sortableElement应该有它自己的index道具：

<PlaylistPage key={index} index={index} page={page} style={{zIndex: 99999999}} /> 

这里是更新到您的jsfiddle：你将ty这么多
https://jsfiddle.net/40vpaLj5/1/