使用asyncData获取数据

Question

我无法使用asyncData从API获取数据。

   <template>
      <v-list>
        <v-list-tile>
            <h1>Test {{category}}</h1>
        </v-list-tile>
      </v-list>
   </template>
   export default {
        data () {
            return {
                category: null
            }
        },
        asyncData() {
            return axios.get('/category')
                .then((res) => {
                    return {category: res.data}
                })
        }
    }

我使用了官方文档https://nuxtjs.org/api/中的一个例子，但没有成功。终结点100%正确。

Answer 1

我会从你的常规数据中删除你的“类别”。我认为您的asyncData函数在服务器端运行良好，但是当组件被挂载时，常规数据会将'category‘设置为null。试试这个：

export default {
  data () {
    return {

    }
  },
  asyncData() {
    return axios.get('/category')
    .then((res) => {
      return {category: res.data}
    })
  }
}