I can't fetch my data

System Information
  • Strapi Version: 4.5.4
  • Database: mySQL
  • Node Version: 16.16.0
  • NPM Version: 8.11.0
  • Yarn Version: 1.22.19

Hi,
I’m trying to fetch my data using strapi but I didn’t succeed …
When I use this :

axios.get("http://localhost:1337/api/test").then((response) => {
  const test = response.data.attributes;
  console.log(response.data);
});

I get this :

{
  data: {
    id: 1,
    attributes: {
      titre: 'bonjour',
      createdAt: '2022-12-28T17:32:31.818Z',
      updatedAt: '2022-12-28T17:32:33.789Z',
      publishedAt: '2022-12-28T17:32:33.738Z'
    }
  },
  meta: {}
}

So everything seems to be working, but when I do this :

Home.getInitialProps = async (ctx) => {
  try {
    const res = await axios.get("http://localhost:1337/api/test");
    const test = res.data;
    return { test };
  } catch (error) {
    return { error };
  }
};

the object homepage is undefined…
And so when I call it in my home.js an error occured

const Home = ({ test, error }) => {
  if (error) {
    return <div>An error occured: {error.message}</div>;
  }

  return (
    <section className="container-home">
      <div className="home">
              <h2> { test.attributes.titre } </h2>
       </div>
    </section>
  );
};

here what I get:

I really don’t understand why I can’t get my data.

And also when I go on http://localhost:1337/api/test I get what what I want.

Thank you for your help,
Thomas

Hello @Hakiba :wave:
I think you want to use Optional chaining (?.) aka Null check the value test?.attributes with an Elvis operator :man_dancing:

Have a read in this article :arrow_right: Optional chaining (?.)