好吧，我可能有一些小问题，但我想不通。
如果我使用 axios 只传递一个 http 请求，一切正常。
但是当我使用多个请求时，我在控制台日志中得到结果但无法发送到 View 文件(laravel blade View 文件)。
让我给你看我的代码:
brand.blade.php
// main element for Vue js el: '#container'
<div id="container" class="row all_brands">
<brands></brands>
</div>
// template for brand component
<template id="brand-template">
<ul>
// if I only pass one http request through axios then my data shows here but for multiple request not showing anything.
<li v-for="brand in list" v-text="brand.brand_id"></li>
</ul>
@{{count}}
</template>
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'
})
谁能告诉我如何在我的 View 文件中显示数据？
最佳答案
发生这种情况是因为 axios.spread 中 this 的范围不正确，早些时候它对你有用，因为你使用的是自动绑定(bind)的 es6 箭头函数这个范围。
您可以进行以下更改以使其工作:
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;
}
))
}
关于laravel-5 - Vue Js - axios 问题使用 laravel 执行多个并发请求，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41629098/