Javascript Reactjs-对处于状态的对象数组进行排序

我试图弄清楚在拖放界面中重新排序菜单项时，我的React组件状态发生了什么变化。在我的代码中，我有一个完全可拖动排序的菜单组件，它从父组件的状态传递一个带有项目数组的对象

处理拖放排序时，我在别处执行所有数组操作，然后使用setState（）或不可变更新覆盖处于状态的数组，这样菜单将重新呈现。问题是，当我尝试执行此操作时，列表会在render（）上重新排序，回到其原始状态（有时是随机排序）。我不确定到底发生了什么，可能是我做错了什么，但同时我尝试了一切。所以它看起来像是有反应的东西，我没有抓住

index.js

var _ = require('lodash');
var Update = require('react-addons-update');

//.....more dnd logic.....//

var myArray = _.cloneDeep($this.state.appMenuData.children);

//get dragged element index
var draggedElemIndex = $this._getNodeIdIndex(el);
var draggedElemObj = myArray[draggedElemIndex];

//element was dragged to the bottom of the list
if(sibling == null){
  var newPos = myArray[myArray.length-1].position;

  myArray[draggedElemIndex].position = newPos;
  myArray[draggedElemIndex].changed = true;

  for(var i = draggedElemIndex+1; i <= myArray.length-1; i++){
    myArray[i].position-=1;
  }

  myArray.sort(function(a, b){
    return a.position-b.position;
  });

  var newData = Update($this.state, {
    appMenuData: {children: {$set: myArray}},
  });

 $this.setState(newData); 
}

//.....more dnd logic.....//

render(){
  <Menu data={this.state.appMenuData} />
}

var=require（'lodash'）；
var Update=require（'react-addons-Update'）；
//……更多dnd逻辑//
var myArray=\ u0.cloneDeep（$this.state.appMenuData.children）；
//获取元素索引
var draggedElemIndex=$this.\u getNodeIdIndex（el）；
var draggedElemObj=myArray[draggedElemIndex]；
//元素被拖到列表的底部
if（同级==null）{
var newPos=myArray[myArray.length-1]。位置；
myArray[draggedElemIndex].position=newPos；
myArray[draggedElemIndex].changed=true；
对于（var i=draggedElemIndex+1；i，这可能与React的虚拟DOM协调算法有关，该算法要求您为数组循环中的项提供唯一id，然后将其嵌入
key={item.id}
。下面是一个更详细的讨论：

看起来您正在正确更新状态，但您需要确保子对象渲染正确。您能为子对象发布渲染代码吗？uuid.v4（）拯救了我的一天。谢谢，伙计！