nuxt ssr时如何在component组件中进行异步数据获取

因为组件没有asyncData方法，所以你不能在组件的服务器端直接获取异步数据。为了绕过这个限制，你有三个基本选择:

1.使用在nuxt 2.12和更高版本中可用的新的fetch钩子函数(ps: ssr时created中不可进行异步接口调用，可在fetch中进行异步处理 async/await or 返回一个Promise)

2.在mounted的钩子中调用API，并在加载时设置数据属性。缺点:不能用于服务器端渲染。

3.在页面组件的asyncData方法中调用API，并将数据作为props传递给子组件。服务器渲染将工作得很好。缺点:页面的asyncData可能可读性较差，因为它正在为其他组件加载数据。

fetch方法是在组件实例化之前被调用的方法，它可以使用this关键字访问组件的上下文。而asyncData方法是在服务器端渲染之前被调用的方法，它并没有组件实例化的上下文，所以不能使用this关键字

  async fetch({ store, params }) {

//需使用async await 或者 return返回一个promise(Nuxt.js 会等这个 promise 完成后再渲染组件)

    let ret = await this.$axios.get('/api/v1/getNowPlayingFilmList')

    this.films = ret.data.data.films;//组件数据设置

    store.commit(setStars, data);//store数据 设置

  }