Unexpected error when using component data as page argument

[Daniel Bachhuber]

Hi 👋

Thanks for the great library 😄

I see an unexpected "Uncaught TypeError: undefined has no properties" error when I use component data as the page argument:

items: createInstance('items', {
    page: this.initialPage,
    args() {
        return {
            order: 'desc',
        };
    }
}),

Is this expected?

[Max Gfeller]

Hi @danielbachhuber!

This unfortunately doesn't work as the createInstance method is called before the component itself is initialized. What you can do is to initialize it to 1 (or anything, really) and in the beforeMount hook set this.items.page to this.initialPage.

[Daniel Bachhuber]

Thanks for the reply, @MaxGfeller 😄

What you can do is to initialize it to 1 (or anything, really) and in the beforeMount hook set this.items.page to this.initialPage.

Hm, this doesn't seem to work either:

beforeMount() {
    let url = new URL(window.location.href);
    this.items.page = url.searchParams.get('page') || 1;
},

I'm relatively new at Vue, so let me know if there's some obvious mistake...

[Daniel Bachhuber]

As it turns out, the created() hook works fine:

created() {
    let url = new URL(window.location.href);
    this.items.page = url.searchParams.get('page') || 1;
},

I'm not sure if there are any negative implications of created vs. mounted though.