profile
viewpoint

Ask questionsQuery result proposal: use actual data or {} to enable easier destructuring

In the Query Component, if the query is still loading, the data variable will be undefined. This behavior is due to the following line:

data: isDataFilled(data) ? data : undefined

What do you think of making data {} instead of undefined? This way, it will be possible to do destructuring of data like so:

<Query query={HEROS_QUERY}>
  {({ loading, data: { heroes } }) => {
    if (loading) {
      return null;
    }

    return (...);
  }}
</Query>

Currently, this will throw Uncaught TypeError: Cannot read property 'heroes' of undefined. With the old query HOC pattern, this was not an issue (from the docs):

const ProfileWithData = graphql(CurrentUserForLayout, {
  props: ({ ownProps, data: { loading, currentUser, refetch } }) => ({
    userLoading: loading,
    user: currentUser,
    refetchUser: refetch,
  }),
})(Profile);

Since loading was moved out of data in the new query component, I can also see why it might make more sense to keep data as undefined when loading is true. Just wanted to get some opinions. 🎉

Version react-apollo@2.1.0-beta.2

apollographql/react-apollo

Answer questions ralvs

Guys, I'm receiving the error above when I update above @apollo/react-hooks@3.0.1 Last test with @apollo/react-hooks@3.1.2 and @apollo/react-ssr@3.1.2 Version 3.0.1 is the last that works for me.

TypeError: Cannot destructure property `tenant` of 'undefined' or 'null'.

My code

const {error, data: { tenant } } = useQuery(CURRENT_TENANT_QUERY);
useful!
source:https://uonfu.com/
Github User Rank List