Iterate through promise object in react component

How can I iterate through the promise object I have returned from my API call.

const [productData, setProductData] = useState(null)
useEffect(() => {
}, [])

async function getProductdata(){
    const secret = "SECRET"
    const request = await fetch(``, {
        headers: {
            'Authorization': `Basic ${btoa(secret)}`,
            'Accept': 'application/json'

enter image description here


If you’re using Promise with then then you should do as:

function getProductdata() {
  const secret = "SECRET";
  fetch(``, {
    headers: {
      Authorization: `Basic ${btoa(secret)}`,
      Accept: "application/json",
  .then((res) => res.json())
  .then(data => setProductData(data);

console.log("pdata", productData);