Estoy tratando de retornar el valor de una promesa pero recibo el siguiente dato: Promesa {< pendiente >}.
Mi código es el siguiente:
**My Class -> Crud.js**
class Crud {
constructor(list, name, price) {
this.list = list;
this.name = name;
this.price = price;
this.getProducts = this.getProducts.bind(this);
}
async getProducts() {
try {
const response = await axios.get('http://localhost:4000/');
const { data } = response;
this.list = data;
console.log('getProducts - list: ', this.list);
//output console: (1) [{…}]
//0: {Id_Product: 1, Name_Product: "Item1", Price_Product: 5}
return (this.list);
} catch (error) {
console.error(error);
}
}
}//End Crud
export default Crud;
**File -> ProductList.js**
import Crud from '../Clases/Crud';
function productListScr (props) {
let lista = [];
let name = '';
let price = '';
let objLista = [];
const crud = new Crud(lista, name, price);
**//sección <test intento 1>:**
objLista = crud.getProducts();
console.log('objLista: ', objLista);
//Output console: Promise {<pending>}, [[PromiseState]]: "fulfilled" , [[PromiseResult]]:
// Array(1)
...
return (
<ScrollView>
{objLista.map(product => {
return (
<ListItem>
<ListItem.Content>
<ListItem.Title>{product.Name_Product}</ListItem.Title>
<ListItem.Subtitle>{product.Price_Product}</ListItem.Subtitle>
</ListItem.Content>
</ListItem>
)
}) //End map
}
</ScrollView>
) //End return
};//End function
export default productListScr;
Al revisar información de manejo de promesas, realice los siguientes cambios y pruebas sin éxito:
//sección <test intento 2>:
objLista = await crud.getProducts();
console.log('objLista: ', objLista); //Unexpected reserved word 'await'
//sección <test intento 3>:
objLista = crud.getProducts().catch(error => {
console.log('Error getProducts : ' + error.message) });
console.log('objLista: ', objLista);
//Output console: Promise {<pending>},[[PromiseState]]:"fulfilled", [[PromiseResult]]:Array(1)
//sección <test intento 4>:
objLista = crud.getProducts().then((value) => {
console.log(`Resuelve promesa: ${value}.`) });
console.log('objLista: ', objLista);
//Output console: Promise {<pending>},[[PromiseState]]:"fulfilled", [[PromiseResult]]: undefined
//Output console: Resuelve promesa: [object Object]
//sección <test intento 5>:
crud.getProducts().then((objLista) => {
console.log('Resuelve promesa:' + objLista) });
console.log('objLista: ', objLista);
//Output console: objLista: [] length: 0
//Output console: Resuelve promesa :[object Object]
Mi objetivo es obtener la carga del arreglo objLista y presentar la lista en pantalla según retorno de la función productListScr().