Hallo, ich hätte eine Frage zu meinem Projekt mit Strapi bzw. React:
Ich bin gerade dabei, eine Website mit Strapi als CMS und Next.js / React.js im Frontend zu erstellen. Als Starter bzw. Vorlage habe ich diesen Blog (von Strapi) hergenommen, um nicht komplett von 0 anzufangen.
Nun habe ich die gesamte Website im Frontend verändert und einen weiteren Content Type für einen Image-Slider erstellt und "befüllt". Jetzt habe ich versucht, die Daten dieses Content Types (title, content, image) in den Slider zu bekommen. Leider funktioniert dies nicht und es erscheinen nur leere HTML Tags (<h2></h2>...) im Sourcecode.
Hier ist mein momentaner Code zu sehen:
import React from "react";
import axios from "axios";
const Slider = ({banners, error}) => {
// Code um Slider funktionsfähig zu machen
if (error) {
return <div>An error occured: {error.message}</div>;
}
return (
<div className="img-slider">
<div className="slide active">
<div className="info">
{banners.map(banner => (
<h2 key={banner.id}>{banner.title}</h2>
))}
<p>
{banners.map(banner => (
<h2 key={banner.id}>{banner.content}</h2>
))}
</p>
</div>
</div>
<div className="slide">
....
</div>
<div className="slide">
....
</div>
<div className="navigation">
<div className="btn-navig active"></div>
<div className="btn-navig"></div>
<div className="btn-navig"></div>
</div>
</div>
);
};
Slider.getInitialProps = async ctx => {
try {
const res = await axios.get('http://localhost:1337/banners');
const banners = res.data;
return { banners };
} catch (error) {
return { error };
}
};
export default Slider;
Bis jetzt habe ich jedoch nur versucht, die Überschrift sowie den Content zu bekommen, mit dem Bild habe ich bis jetzt nur Errors bekommen...
Ich hoffe, jemand kann mir helfen bzw. den Error im Code finden... Vielen Dank!