函数返回“[object Promise]”而不是布尔数据

Question

我试图根据函数返回的布尔值做出决定。 这是我的职能：

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.log(response.data.isAssigned) 时，它会根据请求的结果正确返回 true 或 false，但是当我想在模板中使用它时，函数返回“[object Promise]”而不是是真是假。

这是我在模板内的代码：

<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。

Answer 1

您应该在向用户显示数据之前加载数据：

const loaded = ref(false);
onMounted(async()=>{
  await Promise.all(details.map(d => d.assigned = await isAssigned(data.issue.id));
}