目录

axios.all中的注意事项

为什么要采用全局的JavaScript变量给vue变量

axios.all中的注意事项

如下的请求：

methods:{
 
      getData(){
 
        axios.all([
 
          axios.post('/xxxxxxxxxx', qs.stringify({
            "xxxxxxxxxx": "xxxxxxxxxx",
            "xxxxxxxxxx": "xxxxxxxxxx"
          })),
          axios.post('/xxxxxxxxxx', qs.stringify({
            "xxxxxxxxxx": "xxxxxxxxxx",
            "xxxxxxxxxx": "xxxxxxxxxx"
          })),
          axios.post('/xxxxxxxxxx', qs.stringify({
            "xxxxxxxxxx": "xxxxxxxxxx",
            "xxxxxxxxxx": "xxxxxxxxxx"
          })),
          axios.post('/xxxxxxxxxx', qs.stringify({
            "xxxxxxxxxx": "xxxxxxxxxx",
            "xxxxxxxxxx": "xxxxxxxxxx"
          })),
          axios.post('/xxxxxxxxxx', qs.stringify({
            "xxxxxxxxxx": "xxxxxxxxxx",
            "xxxxxxxxxx": "xxxxxxxxxx"
          })),
          axios.post('/xxxxxxxxxx', qs.stringify({
            "xxxxxxxxxx": "xxxxxxxxxx",
            "xxxxxxxxxx": "xxxxxxxxxx"
          })),
          axios.post('/xxxxxxxxxx', qs.stringify({
            "xxxxxxxxxx": "xxxxxxxxxx",
            "xxxxxxxxxx": "xxxxxxxxxx"
          })),
          axios.post('/xxxxxxxxxx', qs.stringify({
            "xxxxxxxxxx": "xxxxxxxxxx",
            "xxxxxxxxxx": "xxxxxxxxxx"
          }))  
        ]).then(axios.spread(function (v1, v2, v3, v4, v5, v6, v7, v8){
 
          tempArray.length = 0;
          tempArray.push(v1.xxxxxxxxxx);
          tempArray.push(v2.xxxxxxxxxx);
          ......
          ......
        }))
 
         this.xxxxx= tempArray;
      }

这里要注意的地方！在then后不能采用this.vue中的变量，不然会报这样的错误！

vue cli Cannot read property 'xxxx' of null

所以得用一个JavaScript变量去接收，但是这个接收也有个坑，再下面将会说明！

为什么要采用全局的JavaScript变量给vue变量

代码和上面的一样！增加如下的声明：

<script>
  import axios from 'axios'
  import qs from 'Qs'
 
  let tempArray = [];
 
  export default {
    components:{
      .....
      .....
    },
    data(){
      return{
        dynamicListVue: []
      }
    },
    created() {
 
      this.getData();
    },
    mounted(){
      this.getData();
      this.timer = setInterval(this.getData, 5000)
    },
    methods:{
 
      getData(){
        ....
      }
    },
    beforeDestroy() {
      clearInterval(this.timer)
    }
  }
</script>

这里最好是在这个页面的全局下写一个let tempArray = [];

如果在局部写，那么当刷新得到的数据，将会闪烁

闪烁

闪烁

闪烁