how get datas from Hasura hook "useQuery"

Question

I'm a beginner in web development, so I'm trying to do a simple 'GET' with the hook "useQuery" of Hasura, and I can't access to my data. However, my query has been tested on the Hasura console, and it works. I have several array with some datas on the json side.

So I don't understand why when I'm trying to get data in my React project, it doesn't works and datas are set on "undefined".

Here is my code :

const GET_DATA_FOR_ACHIEVEMENTS = gql`
query getDataForAchievments{
  UserAchievements {
    additionalInfo
    created_at
    label
    points
    step
    userEmail
  }
}`;
type AchievementsResult = {
    created_at: string;
    points: number;
    label: string;
    userEmail: string;
    step: string;
    additionalInfo: string;
};


export const Statistics = () => {
  const { user, isLoading } = useAuth0();
  const {data, error, loading} = useQuery(GET_DATA_FOR_ACHIEVEMENTS); 

  let filteredDatas = data.UserAchievements;
  console.log(filteredDatas[0].step);
  console.log("*************")

Someone know why ?

Thanks for you future helps

score 0 · Accepted Answer · answered Jul 22 '21 at 13:30

Initially data will be undefined. do this way.

export const Statistics = () => {
  const { user, isLoading } = useAuth0();
  const {data, error, loading} = useQuery(GET_DATA_FOR_ACHIEVEMENTS); 
  if(loading){
    return 'Loading...';
  }
  if(error){
    return 'error :(';
  }
  let filteredDatas = data.UserAchievements;
  console.log(filteredDatas[0].step);
  console.log("*************")

how get datas from Hasura hook "useQuery"

1 Answers1