Flatlist中对象的React Native sort()不起作用

import React, { Component } from 'react';
import { FlatList, Text, Button, View } from 'react-native';

class App extends Component {
  state = {
    data: [
      { id: '1', name: 'Alice' },
      { id: '2', name: 'Bob' },
      { id: '3', name: 'Charlie' },
      // ...
    ],
  };

  sortData = () => {
    const sortedData = [...this.state.data].sort((a, b) => a.name.localeCompare(b.name));
    this.setState({ data: sortedData });
  };

  renderItem = ({ item }) => (
    <View>
      <Text>{item.name}</Text>
    </View>
  );

  render() {
    return (
      <View>
        <Button title="Sort Data" onPress={this.sortData} />
        <FlatList
          data={this.state.data}
          keyExtractor={(item) => item.id}
          renderItem={this.renderItem}
        />
      </View>
    );
  }
}

export default App;