javascript - 使用 setState 更改状态中的对象数组

Question

import React, {
      Component
    } from "react";
    class App extends Component {
      state = {
        RSVP: [{
          name: ["IronMan"],
          isConfirmed: false
        }]
      };
      handleChecked = () => {
        this.setState({
          isConfirmed: true
        }););
    };
    render() {
        return ( < div > {
              this.state.RSVP && this.state.RSVP.length != 0 ? this.state.RSVP.map(({
                name,
                isConfirmed
              }) => name && name.length != 0 ? ( <
                div key = {
                  name
                } > {
                  name
                } < input type = "checkbox"
                checked = {
                  isConfirmed
                }
                onChange = {
                  this.handleChecked
                }
                /></div > ) : null) : null
            } < /div>);}}
            export default App;

Answer 1

您可以更改数组内对象的状态，您可以使用以下源代码:

handleChange = (index) => {
  let tmp = [...this.state.RSVP];
  tmp[index] = {...tmp[index],isConfirmed: true};
  this.setState({RSVP: tmp})
}