已更改的传入属性不会重新呈现react-sortable-hoc列表

import React, { Component } from 'react';
import { SortableContainer, SortableElement } from 'react-sortable-hoc';

// 创建可排序的列表项组件
const SortableItem = SortableElement(({ value }) => (
  <li>{value}</li>
));

// 创建可排序的列表组件
const SortableList = SortableContainer(({ items }) => (
  <ul>
    {items.map((value, index) => (
      <SortableItem key={`item-${index}`} index={index} value={value} />
    ))}
  </ul>
));

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      items: ['Item 1', 'Item 2', 'Item 3'],
    };
  }

  // 当传入属性发生变化时，重新呈现列表
  componentDidUpdate(prevProps) {
    if (prevProps.items !== this.props.items) {
      this.setState({ items: this.props.items });
    }
  }

  render() {
    return <SortableList items={this.state.items} />;
  }
}

export default App;