Vue-apollo: '$apolloData' of undefined"

Created on 11 Sep 2019  路  5Comments  路  Source: vuejs/vue-apollo

async created() {
this.id = parseInt(JSON.parse(localStorage.getItem("user")).id);
this.$apollo.queries.user.skip = false;

await this.$apollo.queries.user.refetch();
}
if i delete thi.$apollo no such this error
found in

Most helpful comment

make sure you are return the object from

data(){
     return {

       }
 }

in the component you are using apollo in. I had the same issue and that's how it get resolved

All 5 comments

make sure you are return the object from

data(){
     return {

       }
 }

in the component you are using apollo in. I had the same issue and that's how it get resolved

I have both calls with the variables in data I show you my code:
user: { query: gql
query search($id: ID!) {
user(id: $id) {
accounts(limit: 0) {
id
name
type
}
}
}
`,
variables() {
return {
id: this.id
};
},

  skip() {
    return this.skipUser;
  }
},

// Query with parameters
contentsSort: {
  query: gql`
    query Query($limit: Int!, $start: Int!, $where: JSON) {
      contentsSort(limit: $limit, start: $start, where: $where) {
        id
        mediaType
        postText
        postUrl
        contentType
        pubDate
        advert

        Account {
          name
          num_followers_total
          instagram_url
          profile_picture {
            url
          }
        }
        country {
          name
        }

        file_image {
          url
        }
        file_video {
          url
        }
        tags(limit: 0) {
          id
          name
          color
        }
        favorites(limit: 0) {
          favorited
        }
      }
    }
  `,
  // Reactive parameters
  variables() {
    // Use vue reactive properties here
    return {
      where: {
        tags_in: this.tagsIds,
        Account_in: this.accounts,
        contentType: this.contentType,
        Account: this.accountId,
        advert: this.advert
      },

      limit: 10,
      start: 0,
      page: 0,
      pageSize
    };
  },
  skip() {
    return this.skipQuery;
  }
},
tags: {
  query: gql`
    query Query {
      tags(limit: 0, sort: "name:asc") {
        id
        name
      }
    }
  `
}

},
data() {
return {
skipQuery: true,
skipUser: true,
accounts: [],
accountsObject: [],
tags: [],
id: null,
user: {},
contentsSort: [],
accountValue: [],`

the complete log
vue.esm.js?a026:1897 TypeError: Cannot read property '$apolloData' of undefined
at mergeData (vue.esm.js?a026:1190)
at VueComponent.mergedDataFn (vue.esm.js?a026:1227)
at getData (vue.esm.js?a026:4751)
at initData (vue.esm.js?a026:4708)
at initState (vue.esm.js?a026:4645)
at VueComponent.Vue._init (vue.esm.js?a026:5009)
at new VueComponent (vue.esm.js?a026:5157)
at createComponentInstanceForVnode (vue.esm.js?a026:3292)
at init (vue.esm.js?a026:3123)
at createComponent (vue.esm.js?a026:5983)

I had this issue when apollo call is in a custom component

Hey !
I find the solution the files in array was a null

    file_image {
      url
    }
    file_video {
      url
    }

then my code if
(this.content.file_image != null) {
return {
image: this.content.file_image.url
};
}

Was this page helpful?
0 / 5 - 0 ratings

Related issues

alx13 picture alx13  路  4Comments

mathe42 picture mathe42  路  4Comments

igaloly picture igaloly  路  3Comments

ScreamZ picture ScreamZ  路  4Comments

anymost picture anymost  路  3Comments