函数在Vue.js中返回undefined

Question

我试图从mount（）中的方法调用一个函数，但它返回undefined。如果我创建一个console.log，它会显示结果。我做错了什么？

 methods: {
    bsBooks: () => {
      axios
        .get(
          "https://api.nytimes.com/svc/books/v3/lists/best-sellers/history.json?api-key=mykey_is_here"
        )
        .then(res => {
          return res.data.results
        });
    }
  },
mounted() {
  console.log(bsBooks())
}

Answer 1

我找到了一个解决方案，也许它不是最好的，但我们可以在承诺中返回数据，例如

methods: {
    bsBooks: () => {
      return axios
        .get(
          "https://api.nytimes.com/svc/books/v3/lists/best-sellers/history.json?api-key=my_api_key"
        )
        .then(response => response.data.results)
    }
  },
  mounted() {
    this.bsBooks().then(value => console.log(value))
  }

Answer 2

bsBooks()未定义所以使用this.bsBooks()，也将结果存储到名为data的books中并使用它：

<template>
    <ul>
        <li v-for="book in books">{{ book }}</li>
    </ul>
</template>

---

data(){
    return {
        books: []
    }
}, 
methods: {
    bsBooks: () => {
        axios
            .get(
                "..."
            )
            .then(res => {
                return this.books = res.data.results
            });
    }
},
mounted() {
    this.bsBooks();
}