在vue 3组合API中无法处理async props

Question

父组件:

const { getGroup, removePubli, removeTablet, loadTotal, error } = useGroups();

const group = ref({});

getGroup(group_id).then((g) => {
group.value = g;
});

子组件:

const { group } = defineProps({
group: {
type: Object,
default: {},
},
});

给定上面的prop，它是由async axios调用获取的，当我试图在子组件中使用它时，它是未定义的或一个承诺。

我已经尝试在onMounted钩子中放入async，但它不起作用。

getGroup做它:

const getGroup = async (id) => {
const r = await api.get(`/api/v1/groups/${id}`);
if (r?.status !== 200) error.value = "Falhou";
return r.data;
};

我想在代码继续运行之前等待它，或者在promise自行解决时找到做某事的方法。

Answer 1

我在你的代码中没有看到任何await。使用await代替.then!

<script setup>
const { getGroup, removePubli, removeTablet, loadTotal, error } = useGroups();
const group = ref({})
const result = await getGroup(someId)
group.value = result.data // or what ever
</script>