React Query data can be undefined

Hello, any idea how could i make it so i know my data is not undefined when doing like this using react-query:

const queries = {
  query1: useGetSomething(),
  query2: useGetSomething2(),
};

const queriesValues = Object.values(queries)
const isPending = queriesValues.some((query) => query.isPending)
const isError = queriesValues.some((query) => query.isPending)

if(isPending){
  return <div>Loading...</div>
}

if(isError){
  return <div>Error...</div>
}
//data can be undefined
console.log(queries.query1.data)
console.log(queries.query2.data)


this works perfectly fine:

const queries = {
  query1: useGetSomething(),
  query2: useGetSomething2(),
};

if(queries.query1.isPending || queries.query2.isPending){
  return <div>Loading...</div>
}

if(queries.query1.isError || queries.query2.isError){
  return <div>Error...</div>
}

console.log(queries.query1.data)
console.log(queries.query2.data)
Was this page helpful?