如何向React应用添加删除按钮功能

import React from 'react';

class App extends React.Component {
  handleDelete = () => {
    // 在这里编写删除逻辑
  }

  render() {
    return (
      <div>
        <button onClick={this.handleDelete}>删除</button>
      </div>
    );
  }
}

export default App;

import React from 'react';

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: ['数据1', '数据2', '数据3'] // 示例数据
    };
  }

  handleDelete = (index) => {
    const newData = [...this.state.data];
    newData.splice(index, 1);
    this.setState({ data: newData });
  }

  render() {
    return (
      <div>
        {this.state.data.map((item, index) => (
          <div key={index}>
            {item}
            <button onClick={() => this.handleDelete(index)}>删除</button>
          </div>
        ))}
      </div>
    );
  }
}

export default App;