Как отследить что уже currentstep ==2 и выполнить вторую проверку?

Question

[dimonfreeman]

Иметься форма с 3-я шагами.
Добавляю проверку на запылённость поля и деактивации кнопки и Disabled кнопку если не заполнено нужное поле.
watch выполняется только на первом шаге.. дальше не реагирует..
как модифицировать ?

watch: {
      formData: function(step) {
        if (this.where_buy == null && this.currentstep === 1) {
          this.isButtonDisabled =false;
        }
      }
    }

Comments

[Вадим]

а почему бы не перенести isButtonDisabled в computed?

computed: {
  isButtonDisabled() {
    return !(this.where_buy == null && this.currentstep === 1)
  }
}

[dimonfreeman]

Вадим, не помогло...
при выборе значения where_buy , isButtonDisabled не стает false

[Вадим]

dimonfreeman, А покажите начальное значение where_buy и как Вы его меняете?

[dimonfreeman]

Вадим, начальное значение where_buy == null, ето raduio btn при выборе он стает или 0 или 1.

[dimonfreeman]

Вадим, я добавил алерт в isButtonDisabled он тоже не вызывается..

[Вадим]

dimonfreeman, https://codesandbox.io/s/crazy-fermi-zhk78?file=/s...
Посмотрите эту демку.
Кнопка дисэйблится если выбирается шаг 2, либо если выбран один из чекбоксов.
Это то что Вам нужно?

[dimonfreeman]

Вадим, спасибо, уже разобрался с тем что вы ранее. уже заработало дальше допишу.

[dimonfreeman]

Вадим, ага все таки теперь на втором шаге не работает.
isButtonDisabled: function(){
if (this.formData['where_buy'] != null && this.currentstep === 1)
return this.isButtonDisabled = false
else if (this.formData['email'] != null && this.currentstep === 2)
return this.isButtonDisabled = false
else if (this.formData['111'] != null && this.currentstep === 3)
return this.isButtonDisabled = false
else
return this.isButtonDisabled = true
}

[Вадим]

dimonfreeman, так, ну начнём с того, что если Вы делаете return после каждого if, то else не обязательно писать.
Далее - Вы делаете это в computed?
Если да, то не нужно присваивать значения, нужно их просто возвращать.
Ну а каждый шаг я с Вами не могу пройтись, я же не вижу происходящего, а демку Вы не делаете.
Так что Вам нужно просто провести отладку шаг за шагом и, проанализировав, понять почему так происходит.
Ну и чисто на глаз - условие громоздкое. Уверен что его можно упростить.

[dimonfreeman]

Вадим, да делаю в computed, isButtonDisabled передаю в :disabled="isButtonDisabled".

[Вадим]

dimonfreeman, Тогда не нужно присваивать this.isButtonDisabled. = false У Вас computed свойство уже так называется.
Нужно просто делать return false, или true.

[dimonfreeman]

dimonfreeman, код вот https://codepen.io/chrgl86/pen/NRqzww такая идея с шагами + кнопку disable хочу прикрутить.

[dimonfreeman]

Вадим, не подскажете как адаптировать, что б заработало?(

[Вадим]

dimonfreeman, кнопку Next хотите дисэйблить в зависимости от условий на конкретном шаге?
Если да, то так и пишите условие в computed

switch(this.step) {
case 1:
  return !this.were_buy
case 2:
  return !this.formData['email']
case 3:
  return !this.formData['111']
}

и тд

[dimonfreeman]

Вадим, супер , сделал) спасибо.