I am trying to access the title attribute from an array with only one data record. When I use console.log(data), it displays the result as shown in the picture below. However, if I use console.log(data[0].attributes.title), it returns 'undefined'. How can I correctly print the title in the console log?
Full Code
const PostPage = ({ slug }) => {
// console.log(slug)
const QUERY = gql `query getPosts($slug: String!){
posts(filters: { slug: { eq: $slug } }) {
data {
id
attributes {
title
slug
description
}
}
}
}
`;
const { data, loading,error } = useQuery(QUERY,{ variables: {slug}});
console.log(data)
return (
<div class="card p-1">
</div>
);
};
export default PostPage;
export async function getServerSideProps({ query }) {
const slug = query.slug
console.log(slug)
return { props: { slug } };
}