How to update a record in my rails api database using axios in Vue js?

Question

I have this update method and I have read that axios uses put instead of patch to update a record, so I'm trying to update a record on my rails Api from my Vue js app but it gives back a 404 error.

How can I solve it?

updateBook() {
      const book = {
        book_id: this.books.id,
        book_title: this.books.id,
        author_id: this.books.author_id,
        genre_id: this.books.genre_id,

        set bookTitle(title) {
          this.book_title = title;
        },
        set authorId(id) {
          this.author_id = id;
        },
        set genreId(id) {
          this.genre_id = id;
        },
        get title() {
          return this.book_title;
        },
        get id() {
          return this.book_id;
        },
      };
      book.bookTitle = this.book_title;
      book.authorId = this.author_id;
      book.genreId = this.genre_id;
      axios.put('http://localhost:3000/api/v1/books/', book.id)
        .catch((error) => { console.log(error); });
    },

Are you sure http://localhost:3000/api/v1/books/ is working? 404 usually means that the end point was not found. — T. Short
– T. Short, Commented Jan 5, 2020 at 10:13
I'm trying to concatenate this address with the book id that's why I have ", book.id" at the end. However, the address by itself works! — user12192123
– user12192123, Commented Jan 5, 2020 at 10:17
That's not how multiple arguments to .put work: github.com/axios/axios#axiosputurl-data-config. Try `http://localhost:3000/api/v1/books/${book.id}` as the URL instead. — jonrsharpe
– jonrsharpe, Commented Jan 5, 2020 at 10:18

T. Short · Accepted Answer · 2020-01-05 10:21:53Z

2

You should concatenate the addess like this:

`http://localhost:3000/api/v1/books/${book.id}`

And for the second argument you should pass is the data you want to update

axios.put(`http://localhost:3000/api/v1/books/${book.id}`, {
    data: newData // this is just an example
})
.catch((error) => { console.log(error); });

answered Jan 5, 2020 at 10:21

T. Short

3,62417 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to update a record in my rails api database using axios in Vue js?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related