nuxtjs asyncData使用经验—如何发起多个axios请求并携带参数

分类:计算机 | 前端 | Nuxt.js | 综合 1231
更新:2020-10-18 01:56:54
编辑

1 示例代码

<script>
import axios from "~/plugins/axios";
import ShowArticleList from "../components/ShowArticleList";
import ViewRankList from "../components/viewrank/ViewRankList";

export default {
  name: "indexArticle",
  async asyncData({ params, error }) {

    //发送多个axios请求
    let [request1Data,request2Data] = await Promise.all([
      axios.get(requrl1,{params: {
            articleid: 12,
            name: '测试'
          }}),
      axios.get(requrl2)
    ])

    //其它操作...

    return {
      articleList: request1Data.data,
      viewRankList: request2Data.data
    }
  },
  components: {
    ShowArticleList,
    ViewRankList
  },
};
</script>

2 说明

requrl1和requrl2是两个axios请求的地址,第一个请求携带了参数。
request1Data和request2Data是两个请求的返回结果。