A continuación se muestra mi código. Ya ejecuté "musical" a través de un registro de la consola y puedo confirmar que está devolviendo mis datos de estado. Mi objetivo es porque no todos los objetos que tienen "precio de compra" tienen un valor (algunos devuelven un valor nulo), quiero ejecutar este condicional donde puede dar una cadena que alerte a los usuarios "esto no está a la venta". si es nulo, o devolver el precio correcto si existe en la API.
import React, { useEffect, useState } from "react"; import fishes from "../APIs/animalCrossing"; export default function Music() { const [music, setMusic] = useState([]); useEffect(() => { fishes.getVillagerMusic().then((response) => { setMusic(response); }); }, []); const buyMusic = () => { music.map((musical) => { if (musical["buy-price"] == null) { return "This Song is not for purchase"; } else { return musical["buy-price"]; } }); }; return ( <div> {music.map((music, index) => { return ( <div key={index}> <img src={music.image_uri} alt="music" /> <p> Sold at: ${buyMusic()} </p> </div> ); })} </div> ); }