I am trying to fetch data from MySQL database and I am using the map function
const [companies, setCompanies] = useState([]);
useEffect(() => {
getCompany();
}, []);
const getCompany = async () => {
const companies = await axios.get('http://localhost:8080/companies');
setCompanies(companies.data);
};
This is the code of fetching data and this is how I am retrieving it in frontend
<article className="ps-block--store-2">
<div
className="ps-block__content bg--cover"
style={{
background: `url('/static/img/vendor/store/default-store-banner.png')`,
}}>
<figure>
{companies.map((company) => (
<h4>
<Link
// href="/store/[slug]"
// as={`/store/${source.slug}`}
>
<a>{company.company_name}</a>
</Link>
</h4>
))}
<div className="ps-block__rating">
<Rating />
</div>
</figure>
</div>
</article>
but it throws this error
1 of 1 unhandled error
Unhandled Runtime Error
TypeError: companies1.map is not a function
CodePudding user response:
Your code seems fine it must be some error in the backend have you made any show controller in your backend?