反應可排序，特別當我拖動的元素

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/