Reactjs 从组件迁移将获得支持

组件WillReceiveProps正在被弃用，但是，我不清楚如何从中迁移出去。例如，my current的简化版本如下所示：

import Reorder, {reorder, reorderImmutale, reorderFromTo, reorderFromToImmutable} from 'react-reorder'

class ObjectsArea extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
        items: this.props.objects ? this.props.objects.items : []
    };
  }

  componentWillReceiveProps(nextProps){
    //May have to do a deep compare between nextProps.items and current items?
    if (nextProps.objects){
        this.setState({items: this.nextProps.objects.items})
    }
  }

  onReorder (event, previousIndex, nextIndex, fromId, toId) {
    let new_items = reorder(this.state.items, previousIndex, nextIndex)
    this.setState({
      items: new_items
    });
    //call to parent function
  }

  render(){
    orderable_items = <Reorder reorderId="objects" onReorder={this.onReorder.bind(this)}>
        {
            this.state.items.map(item => (
                <div key={item.id}>
                    {item.text}
                </div>
             ))
         }
    </Reorder>

    return (
         <div>{orderable_items}</div>
    )

}

我的要求：

有时没有对象属性，初始加载时没有对象属性 当存在对象属性时，将使用react-reorder组件创建可排序/可拖动列表 当拖动列表中的项目以进行重新排列时，将调用onReorder函数。 onReorder函数应该做两件事：更新屏幕上的列表，调用从props传入的父函数。 目前所有这些都适用于componentWillReceiveProps，但是，基于上述要求，从componentWillReceiveProps迁移的正确方法是什么？

在您的问题中，您可以这样做

静态GetDerivedStateFromPropsExtProps，prevState{ 如果nextrops.objects{{ 返回{items:this.nextrops.objects.items}； } 否则返回null； }

---

为了更好地理解，请遵循

虽然托尔西的答案完全正确，但也值得一提的是，react文档建议删除基于道具计算的派生状态。在我看来，这是一个很好的解读

你的例子完全符合这个例子

在不了解您的环境的情况下，我无法推荐一个解决方案，但对我来说，您似乎可以使用该示例

---

在这种情况下，您需要简单地使用objects.items来呈现您的重新排序子级，并且在onReorder事件期间，只需调用您作为道具收到的函数。

但是，当通过道具到达新列表时，这些项是否会以这种方式失去排序？在我看来，排序不是此组件的责任从compo迁移出去我们将收到道具