Iām having trouble mapping data from the NFT API in react.js
Essentially the goal here is to map the result from the API into react to be shown on the browser.
Other goals are at hand but Iāll settle on this issue first (:
Iām sure Iām overlooking something and thereās a mistake made somewhere but I havenāt been able to identify what could be wrong with the issue and with limited time Iāve only had so many trials to run.
The code is as follows:
ā/App.jsā
import "./App.css";
import { useState } from "react";
import { useMoralisWeb3Api } from "react-moralis";
// 0x88b38FDd8d1671f49263541534C0d6FDd002023B
// 0xeF87529Ca9c67a849bD7013837fC42d4DE92ca82 -- Goonz Portal
function App() {
const Web3Api = useMoralisWeb3Api();
const [Goonz, setGoon] = useState();
const fetchAllTokenIds = async () => {
const options = {
address: "0xeF87529Ca9c67a849bD7013837fC42d4DE92ca82",
};
const NFTs = await Web3Api.token.getAllTokenIds(options);
setGoon(NFTs);
console.log(NFTs.result[0]);
};
return (
<div className="App">
<button onClick={fetchAllTokenIds}>Click Me</button>
<h1>DATA</h1>
{/* <ol>
{Goonz.map(Goonz => {
return <li>{Goonz.token_id}</li>;
})}
</ol> */}
</div>
);
}
export default App;