好吧,我可能有个小问题,但我不知道。
如果我仅使用axios通过一个http请求,则一切正常。
但是当我使用多个请求时,会在控制台日志中得到结果,但无法发送以查看文件(laravel刀片视图文件)。
让我告诉你我的代码:
brand.blade.php
// main element for Vue js el: '#container'// template for brand component// if I only pass one http request through axios then my data shows here but for multiple request not showing anything.
@{{count}}
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' })
任何人都可以让我如何在视图文件中显示数据吗?
之所以发生这种情况,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; } )) }