$lazy: true causing Error in beforeCreate hook: "TypeError: Cannot read property '***' of undefined"

[wildhart]

If a meteor property relies on any props or other component data or computed properties, it causes an error when used with $lazy: true. It seems that the function is being called within the beforeCreate hook at which point the other data doesn't exist yet.

e.g:

props: ['userId'],
meteor: {
    $lazy: true,
    avatar() {
        console.log(this.userId); // [Vue warn]: Error in beforeCreate hook: "TypeError: Cannot read property 'userId' of undefined"
        const user = Meteor.users.findOne({_id: this.userId}, {fields: {"profile.avatar": 1}});
        return Meteor.absoluteURL('avatars/'+user.profile.avatar);
    }
}

My work-around is to do this instead:

props: ['userId'],
computed: {
    avatar() { () => { return this.$autorun(() => {
        console.log(this.userId); // no problem
        const user = Meteor.users.findOne({_id: this.userId}, {fields: {"profile.avatar": 1}});
        return Meteor.absoluteURL('avatars/'+user.profile.avatar);
    })}
}

[wildhart]

Hi @Akryum, is there any chance Meteor Vue integration could get some love, or at least some guidance from you? These bugs have existed for a while...