Back to questions
Middle
5
Вызовите функцию getProducts в компоненте Vue 3 и отрисуйте полученные результаты в шаблоне.
Companies where asked
АО Пари Страховая компания
Answer from AI
sobes.tech AI
В Vue 3 для вызова асинхронной функции getProducts и отображения результатов можно использовать Composition API с setup и реактивным состоянием. Пример:
<template>
<div>
<ul>
<li v-for="product in products" :key="product.id">
{{ product.name }} - {{ product.price }}
</li>
</ul>
</div>
</template>
<script setup>
import { ref, onMounted } from 'vue'
const products = ref([])
async function getProducts() {
// Здесь должен быть реальный вызов API
return [
{ id: 1, name: 'Товар 1', price: 100 },
{ id: 2, name: 'Товар 2', price: 200 }
]
}
onMounted(async () => {
products.value = await getProducts()
})
</script>
В этом примере при монтировании компонента вызывается getProducts, результат сохраняется в реактивную переменную products, и данные отображаются в списке.