Checking variable outside of its scope

Question

In my code I want to execute a query conditionally and then check its loading variable inside the template, but only if the query is executed and don't want to have any TypeScript errors in my file. How do I check this variable which might or might not exist in its context?

I am using Apollo GraphQL.

if( executeMyQuery )
{
    const {
        data, loading: loadingQuery
    } = useQuery( MyQuery );
}

return (
    <View>
        { /* ... some code ... */ }
        { executeMyQuery && loadingQuery ?
            <Text>Query is loading...</Text>
            { /* ... some code ... */ }
        : null }
    </View>
);

TypeScript says: Cannot find name 'loadingQuery'.

Answer 1

Fixed it using the skip parameter by changing

if( executeMyQuery )
{
    const {
        data, loading: loadingQuery
    } = useQuery( MyQuery );
}

To

const {
    data, loading: loadingQuery
} = useQuery( MyQuery, {
    skip: executeMyQuery,
} );