CODEWITHSUNDEEP
reactjs
Robinj
Robinj

Reputation: 31

How to update one part of state with setState

i'm trying to use setState to update one property of a sub object of the state. What is the correct way to do this? I want to access the state and define which part I want to update, as opposed to update the entire state with a new state. Hope that makes sense...

class BooksApp extends React.Component {
  state = {
    books: []
  }

componentDidMount() {
  BooksAPI.getAll().then((books) => {
    this.setState({books})
  })
}
selectStateUpdate = (book,shelf) => {
  this.updateShelf(book, shelf);

}
updateShelf = (book, shelf) => {
  BooksAPI.update(book, shelf)
  .then(() => {
    for (var i=0; this.state.length < i; i++) {
      if (this.state.title === book.title) {
        this.setState({
          books[i].shelf: book.shelf
        })
      }
    }
  })
}

Upvotes: 0

Views: 474

Answers (1)

Ivan Burnaev
Ivan Burnaev

Reputation: 2730

Try to change your state changing part to:

this.setState({
  books: this.state.books.map((item, index) => 
    index === i ? {...item, shelf: book.shelf} : item
  )
})

Upvotes: 1

Related Questions