Функция, возвращающая «[object Promise]» вместо логических данных
Я пытаюсь принять решение на основе возвращаемого логического значения функции. Это моя функция:
const isAssigned = async (issueId) => {
try {
const response = await axios.get(route('issueAssigned', { issueId: issueId }));
return response.data.isAssigned;
} catch (error) {
console.error(error);
return false;
}
};
когда я console.info(response.data.isAssigned) внутри функции, он возвращает true или false в зависимости от результата запроса правильно, но когда я хочу использовать его в шаблоне, функция возвращает «[object Promise]», а не true или ложь.
Это мой код внутри шаблона:
<tr v-for = "(detail, index) in details" :key = "index">
<td class = "align-middle" >{{ index + 1 }}</td>
<td class = "align-middle" colspan = "3">
<div v-if = "isAssigned(detail.issues.id)">
<span class = "text-success">Assigned</span>
</div>
<div v-else>
<span class = "text-danger">Not Assigned</span>
</div>
</td>
</tr>
Он всегда возвращает true.
я использовал ожидание при получении результата запроса и сохранении его в ответ.
@Newbie Вам нужно использовать его везде, где вы имеете дело с обещаниями, «асинхронность» заразительна. Поскольку в шаблоне его использовать нельзя, сюда он не подходит.
Ответы 2
Вам следует загрузить данные перед их отображением пользователю:
const loaded = ref(false);
onMounted(async()=>{
await Promise.all(details.map(async d => d.isAssigned = await isAssigned(d.issues.id));
loaded.value = true;
}
<template v-if = "loaded">
<tr v-for = "(detail, index) in details" :key = "index">
<td class = "align-middle" >{{ index + 1 }}</td>
<td class = "align-middle" colspan = "3">
<div v-if = "detail.isAssigned">
<span class = "text-success">Assigned</span>
</div>
<div v-else>
<span class = "text-danger">Not Assigned</span>
</div>
</td>
</tr>
</template>
Поскольку isAssigned не является частью детализации, я не могу использовать его напрямую с детализацией, но нашел решение на основе вашей идеи. Спасибо!
Асинхронные функции возвращают выполненное обещание, если оператор return намеревается вернуть обычное значение, отличное от обещания.
Это возвращаемое значение должно обрабатываться с помощью await или через механизм Promise.
let res = await myAsyncFunc()
console.info(res)
//or
let res = myAsyncFunc()
res.then((resolved => console.info(resolved)))
Пропущена буква "а" в ожидании...
Функция асинхронная, поэтому вам нужно ее где-то
await.