zoukankan      html  css  js  c++  java
  • 记录一次axios请求造成的数组初始化失败

    axios请求是一个异步的请求,简单来讲就是在做其他事情的时候可以把这个先放一边等其他的事情做完后再来做这件事件。

    我之前这样调用了一个方法:

    mounted() {
            this.first()
            this.next();
        }
    first(){
         this.next();
    }
    next(){
        this.Array = [];
        axios.post(url).then((res)=>{
             this.Array.push(res)
        })        
    }

    可以看到我是调用了两次的next事件,我在next最开始的部分对数组进行了初始化,按照我的预想是这个数组里面始终只有一个接口返回的res数据在里面,但是执行后发现数组里面有两个res。

    后来对next和axios打印后发现,first的时候执行了初始化数组,但是并没有立即执行axios,把axios放一边,然后向下执行遇到next,于是再次执行初始化,执行完成后发现没有了,所以就找到axios,因为两次调用了axios所以push了两个res到数组里面去。

    把代码改为这样,就解决了:

    mounted() {
            this.first()
            this.next();
        }
    first(){
         this.next();
    }
    next(){
        axios.post(url).then((res)=>{
            this.Array = [];
             this.Array.push(res)
        })        
    }

    严格来讲这个并不是axios请求的锅,是我本身对同步,异步执行的顺序存在理解上的问题,这个锅要自己背。

    而最开始我对于同步异步的简单概述其实也是不标准的,对于异步,同步,阻塞,非阻塞还请参考其他大神的详细解释。

  • 相关阅读:
    IE, FireFox, Opera 浏览器支持CSS实现Alpha半透明的方法
    5个CSS3技术实现设计增强
    SQL Server 2005 中的分区表和索引
    推荐12款可用于前端开发的免费文本编辑器
    960 Grid System
    初识Byte
    在线制作网站
    sqlserver操作符篇 优化
    ASP.NET 异常处理
    Photoshop 隐藏的快捷键
  • 原文地址:https://www.cnblogs.com/sixrookie/p/10749183.html
Copyright © 2011-2022 走看看