Infinite update loop with :ready in second step

[murbanowicz]

Hi,
I have registration in STEPPER component.
I am using vee-validate for validation so :ready has to rely on successful validation of step.
I have computed properties for that:

readyStep1 () {
        this.$validator.validateAll('step-1')
        if (this.errors.any('step-1')) {
          return false
        }
        else {
          return true
        }
      },
      readyStep2 () {
        if (this.readyStep1) {
          this.$validator.validateAll('step-2')
          if (this.errors.any('step-2')) {
            return false
          }
          else {
            return true
          }
        }
        else {
          return false
        }
      },

It is working perfectly fine with step-1, but if I apply :ready="readyStep2" to step-2 component, I am getting infinite update loop... No idea what is wrong and why it is working fine with first step, but not working with step-2 or step-3.
What is important is that value of readyStep2 is set properly so it is true when validation passes and false as long as it fails.

[rstoenescu]

Hi,

This is a problem with how you use vee-validate rather than a problem with Stepper. Why do you need on step 2 to check if there's no validation errors from step 1? The user should not be able to reach step 2 if there are errors on step 1 in the first place. So remove the reference to readyStep1 from readyStep2.

[murbanowicz]

It was just example.
It is not working despite of that step-1 is there or not. It is always
getting into infinite update loop...

2016-11-16 10:27 GMT+00:00 Razvan Stoenescu [email protected]:

Closed #195 #195.

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
#195 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AI80kjIoCLn6HHBjjtP-AqGNwm4yAY6Xks5q-tqSgaJpZM4KzKKr
.

[rstoenescu]

ok, will investigate

[murbanowicz]

It should be easy to replicate.
Stepper, inputs in 2 steps, vee-validate with 2 scopes and the same
functions ready for both scopes.
Would be great if you would find the reason. I spent long time last night
and had to go to sleep without solution.

2016-11-16 10:44 GMT+00:00 Razvan Stoenescu [email protected]:

ok, will investigate

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
#195 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AI80koq0YQXz8rBOHnv9bnJUKogSY7Jlks5q-t6hgaJpZM4KzKKr
.

[rstoenescu]

Can you supply a *.vue file showcasing the issue to speed things up pls?

[murbanowicz]

I sent it by email right now.

[rstoenescu]

Just analyzed your code. The infinite loop is happening outside of Stepper's code logic. You are using computed properties which trigger each other because of this.errors changing for each validation. Just find some other way of dealing with this. In any case, Quasar is not at fault. Would help you more, but simply don't have enough time :(