[Vuejs]-How to write a function with data from different jsons?

by

0👍

✅

I’d use a computed property here instead. So make the calls as you are and remove the returnAuthorName function.

The way these work, is as items updates, this method will be called and return something.

computed: {
  booksWithAuthor () {
    const { books, authors } = this.items

    // If we don't have both of these don't do anything...
    if (books.length === 0 || authors.length === 0) {
      return []
    }

    return books.map(book => ({
      ...book,
      author: authors.find(author => author.id === book.authorId),
    }))
  },
}

Then in your template you’d have: book.author.name, just loop through booksWithAuthor instead of items.books.

Leave a comment