nuxt入门教程（九）异步获取数据

如何使用异步数据？

官方声明

官方：不能在组件中使用异步。
但是你可以在父级使用异步，在通过组件传值的方法传给你的组件。

所以，我这里使用了vuex。看代码

首页中调用

首页拿到数据以后，先给自己的data暂存一下，然后在通过created周期，通过commit发送给vuex即可，或者通过props发送给组件。

asyncData(context) {
        return context.$axios.get('index/query')
        .then(res => {
          //赋值
          return {index:res.data.result[0]};
        })
      },


created:function(){
        //首页数据提交给vuex
        this.$store.commit('getIndex',this.index)
        //console.log("页面加载完毕！");
      },

组件页面

<p>站长：党云龙 QQ：{{$store.state.index.qq}} 微信：{{$store.state.index.wx}} 联系电话...