VUE—axios的all并发请求（图文详情）

最新推荐文章于 2024-07-12 16:48:23 发布

Poppy_LYT

最新推荐文章于 2024-07-12 16:48:23 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

分类专栏： VUE 文章标签： VUE

本文链接：https://blog.csdn.net/Poppy_LYT/article/details/98178149

VUE 专栏收录该内容

68 篇文章

订阅专栏

本文介绍了一种在Vue中使用axios进行并发请求的方法，通过axios.all实现GET和POST请求的同时发送，展示了如何处理并发请求返回的数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

VUE—all并发请求

<script>
  import axios from 'axios'

  export default {
    name: "all",
    methods: {
      getUrl () {
        return axios.get('https://www.easy-mock.com/mock/5d41580a1a802c0d5e53dcc2/example/aa')
      },
      postUrl () {
        return axios.post('https://www.easy-mock.com/mock/5d41580a1a802c0d5e53dcc2/example/bb')
      },
      allUrl () {
        axios.all([this.getUrl(), this.postUrl()])
          // 注意里面是一个数组，不要出错
          .then(axios.spread((res1, res2) => {
            // 注意里面是箭头函数，容易出错
            // res1是getUrl获取的， res2是postUrl获取的
            console.log(res1.data, res2.data)
          }))
      }
    },
    created () {
      this.allUrl()
    }
  }
</script>

在这里插入图片描述