使用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}
    })
  }
}