Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Uncaught TypeError: Cannot read property 'validateAfterLoad' of undefined #91

Closed
player1537 opened this issue Nov 1, 2016 · 7 comments

Comments

@player1537
Copy link

player1537 commented Nov 1, 2016

I get this error when I try to use the VueFormGenerator component without passing in an options property. For example,

<template>
    <vue-form-generator :schema="schema" :model="model"></vue-form-generator>
</template>

<script>
import { component as VueFormGenerator } from 'vue-form-generator';

export default {
    components: {
        VueFormGenerator,
    },

    data() {
        return {
            schema: {
                fields: [
                    { model: 'foo', type: 'number' },
                ],
            },
            model: {
                foo: 3.14,
            },
        },
    },
};
</script>

The bug is in the watch method in src/formGenerator.vue, where the library does not check if this.options is truthy before checking if this.options.validateAfterLoad is true. Reference.

There are two potential solutions to this problem: either set default values for the options property or add an additional check for this.options before access this.options.validateAfterLoad.


To set a default value, the library could define its props as:

<script>
export default {
    props: {
        schema: Object,
        options: {
            type: Object,
            default: {
                validateAfterLoad: false,
            },
        },
        // etc
    },
};
</script>

To just add the extra check, the code would need to change from:

// Model changed!
if (this.options.validateAfterLoad === true && this.isNewModel !== true)
    this.validate();
else
    this.clearValidationErrors();

to:

// Model changed!
if (this.options && this.options.validateAfterLoad === true && this.isNewModel !== true)
    this.validate();
else
    this.clearValidationErrors();

so that it matches the line later in the same file: Reference:

// First load, running validation if neccessary
if (this.options && this.options.validateAfterLoad === true && this.isNewModel !== true)
    this.validate();
else
    this.clearValidationErrors();
@icebob
Copy link
Member

icebob commented Nov 1, 2016

Thank you @player1537. Could you make a PR with this fix? I prefer the prop's default value solution.

@player1537
Copy link
Author

player1537 commented Nov 1, 2016

Sure, I will make a PR when I get home later today. I'm having some trouble downloading one the packages in package.json (the kazupon/git-commit-message-convention one), but I think it will work from home.

@icebob
Copy link
Member

icebob commented Nov 1, 2016

OK, I will check this kazupon module, maybe it is an unused module

icebob added a commit that referenced this issue Nov 3, 2016
@icebob
Copy link
Member

icebob commented Nov 3, 2016

Fixed. Will be released in v0.6.0

@icebob icebob closed this as completed Nov 3, 2016
@player1537
Copy link
Author

Thank you! Sorry I didn't get to it in time.

@icebob
Copy link
Member

icebob commented Nov 3, 2016

No problem :)

@icebob
Copy link
Member

icebob commented Nov 14, 2016

Released

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants