Vue2从api回调中设置变量
Vue2从api回调中设置变量
提问于 2021-07-23 12:28:32
我让这个函数返回一个回调，作为：
function fetchShifts(ctx, callback) {
const accountId = selectedAccount.value.value.id
store.dispatch('app-action-center/fetchShifts', {
accountId,
})
.then(shifts => {
const data = []
shifts.forEach(async (shift, index) => {
const user = await store.dispatch('app-action-center/fetchUserDetails',
{
assignedTo: shift.assignedTo,
})
.then(res => res)
data.push({
...shift,
user: user.fullName,
})
if (index === (shifts.length - 1)) { callback(data) }
})
})
}在vue文件中，我尝试将其设置为：
data() {
return {
shifts: this.fetchShifts,
}
},或
data() {
return {
shifts: null,
}
},
created() {
this.shifts = this.fetchShifts()
}它们都不起作用，我想在组件挂载时使这个shifts变量就绪，这样我就可以把它放到<app v-for="shift in shifts" />中了。
此时，这段代码在<b-table :items="fetchShifts />中运行良好，但我不知道如何转换为<ul v-for="shift in shifts></ul>
回答 1
Stack Overflow用户
回答已采纳
发布于 2021-07-23 13:18:58
就像这样：
<ul v-for="shift in shifts" :key="shift.id">
</ul>export default
{
data()
{
return {
shifts: [],
};
},
created()
{
this.fetchShifts(undefined, (shiftsArray) =>
{
this.shifts = shiftsArray;
});
}
}解释--一开始你用一个空数组开始。然后异步地获取这些移位。一旦所有的移位和相应的用户都被获取，回调就会被调用--在这个回调中，您可以用移位更新数组，这反过来会触发组件的重新呈现。
Vue真的很棒！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/68499215
复制相关文章
相似问题
腾讯云开发者
