Using parse in Quasar (vue) to fetch data from data - return undefined

Question

Im using parse.js for pulling data from database in SPA build in Quasar (based on vue.js). Im getting data undefined when fetching data from my database when calling the data through a method but it works when I put it straight into the create function. I guess they might be in different scopes (?) but I cannot figure out why.

This works:

export default {
  name: "MyPage",
  data() {
    return {
      myData: []
    };
  },

  created: async function() {
    let query = new parse.Query("TheData");
    const results = await query.find();
    this.myData = results;
    console.log(this.myData);
  }

But when I encapsulate the data into a method it returns

TypeError: Cannot set property 'myData' of undefined

export default {
  name: "MyPage",
  data() {
    return {
      myData: []
    };
  },

  created: async function() {
    this.getTheData();
  },
  methods: {
    getTheData: async () => {
      let query = new parse.Query("TheData");
      const results = await query.find();
      this.myData = results; // TypeError: Cannot set property 'myData' of undefined
      console.log(this.myData);
    },

tony19 · Accepted Answer · 2022-07-15 05:19:45Z

1

I recommend that you try changing this

created: async function() {
  this.getTheData();
}

for

async mounted() {
    this.getTheData();
}

According to the documentation it says:

Don't use arrow functions on an options property or callback, such as created: () => console.log (this.a) or vm. $ watch ('a', newValue => this. myMethod ()). Since an arrow function doesn't have a this, this will be treated as any other variable and lexically looked up through parent scopes until found, often resulting in errors such as Uncaught TypeError: Cannot read property of undefined or Uncaught TypeError: this.myMethod is not a function.

https://v2.vuejs.org/v2/guide/instance.html#Instance-Lifecycle-Hooks

edited Jul 15, 2022 at 5:19

tony19

140k23 gold badges281 silver badges354 bronze badges

answered Feb 17, 2021 at 13:58

Manuel Temple

7735 silver badges5 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using parse in Quasar (vue) to fetch data from data - return undefined

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related