将新元素添加到数组或更新现有元素(React状态)

import React, { Component } from 'react';

class MyComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      elements: ['element1', 'element2', 'element3']
    };
  }

  addElement = () => {
    const newElement = 'newElement';
    this.setState(prevState => ({
      elements: [...prevState.elements, newElement]
    }));
  }

  updateElement = (index) => {
    const updatedElement = 'updatedElement';
    this.setState(prevState => {
      const updatedElements = [...prevState.elements];
      updatedElements[index] = updatedElement;
      return { elements: updatedElements };
    });
  }

  render() {
    return (
      <div>
        <button onClick={this.addElement}>Add Element</button>
        <button onClick={() => this.updateElement(1)}>Update Element</button>
        <ul>
          {this.state.elements.map((element, index) => (
            <li key={index}>{element}</li>
          ))}
        </ul>
      </div>
    );
  }
}

export default MyComponent;