当前位置:  开发笔记 > 编程语言 > 正文

Vue Js-axios的问题与laravel执行多个并发请求

如何解决《VueJs-axios的问题与laravel执行多个并发请求》经验,为你挑选了1个好方法。

好吧,我可能有个小问题,但我不知道。

如果我仅使用axios通过一个http请求,则一切正常。

但是当我使用多个请求时,会在控制台日志中得到结果,但无法发送以查看文件(laravel刀片视图文件)。

让我告诉你我的代码:

brand.blade.php

// main element for Vue js el: '#container'
// template for brand component

brand.js

Vue.component('brands',{

template: '#brand-template',

data: function(){

    return{

        list: [],
        count: ''
    }

},

created: function(){

    //axios.get('api/brands').then(response => this.list = response.data) ; // here I send only one gttp request and working find..

    axios.all([
    axios.get('api/brands'),
    axios.get('api/brand_count')
    ])
        .then(
        axios.spread(
            function (brand, count) {
             // this is not working and not set these data to my brand.blade.php file template
             this.list = brand.data;
             this.count = count.data;
             // console show me all the data that coming from http request  
            //console.log('list',brand.data);
            //console.log('count',count.data);
            }
    ))

}

});


new Vue({

el: '#container'

})

任何人都可以让我如何在视图文件中显示数据吗?



1> Saurabh..:

之所以发生这种情况,this是因为的作用域在中不正确axios.spread,在您使用es6箭头功能时,它对您不起作用,该功能会自动绑定this作用域。

您可以进行以下更改以使其起作用:

created: function(){
    var that = this    
    axios.all([
    axios.get('api/brands'),
    axios.get('api/brand_count')
    ])
        .then(
        axios.spread(
            function (brand, count) {
             that.list = brand.data;
             that.count = count.data;
            }
    ))

}

推荐阅读
手机用户2502851955
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有