Im trying to make a call to the first APi that contains a payload of different CATEGORIES and then use that to make a second call to another API that contains different category items from each CATEGORY from the first. I am new to react and don’t quite know how to make the logic work. This is my idea below. Category items are displayed based on the selected CATEGORIES. I am confused on how to use the value from the first to make the second call.
const [catalog,setCatalog] = useState([]);
const [catalogItems,setCatalogItems]= useState([]);
useEffect(() => {
const fetchData = async () => {
await fetchMarketingCategories()
.then((result)=>{
setCatalog(result);
console.log("result",result);
})
.then(async (categoryId)=>{
const {items = []} = await getAdvisorMarketingCatalog(categoryId)
setCatalogItems(items);
})
};
fetchData();
});
}, []);