Validation based on css classes?

I was just curious about my method for validation. I am using a scoped slot to insert more fields into a dynamic component that all get a class applied if they are invalid. Thee validation logic is fairly simple so I just used a watcher to collect the amount of elements with the class applied to “validate” the whole form.

@Watch("item", { deep: true, immediate: true })
    onItemChange()
    {
        if(this.$refs.form)
        {
            this.$nextTick(() =>
            {
                this.disabled = (this.$refs.form as any).getElementsByClassName("is-danger").length > 0;
            });
        }
    }

I did it this way because the fields are split between two components and will be constantly changing based on the parent component. Is this a legitimate form of validation? Or are there some unseen side effects from this. The item object is always the container for whatever dynamic data is injected and the form is simply a wrapper for the component.