title: Vuelidate password and confirm password in Vuejs?
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>export default {
    name: "HelloWworld",
  
    data: function () {
      return {
        
        isHidden: false,
        isWelcome: false,
        isFadeout: false,
        
        }
        }
  
  &lt;div  v-if="!isHidden"&gt;
   //some code for screen1
   
    &lt;button v-on:click="isHidden = true"&gt; HELLO&lt;/button&gt;
    &lt;/div&gt;
    
     &lt;div  v-else-if="isHidden &amp;&amp; !isFadeout"&gt;
   //some code for screen 2
   
    &lt;button v-on:click="isFadeout = true"&gt; Hi&lt;/button&gt;
    &lt;/div&gt;
    
     &lt;div  v-else-if="isFadeout &amp;&amp; isHidden &amp;&amp; !isWelcome"&gt;
   &lt;input
              :type="passwordFieldType"
              v-model="user.password"
              id="password"
              name="password"
              class="input-section-three"
              :class="{ 'is-invalid': submitted &amp;&amp; $v.user.password.$error }"
              placeholder="Enter new password"
              :maxlength="maxpassword"
              v-on:keypress="isPassword($event)"
            /&gt;
  
  &lt;div
              v-if="submitted &amp;&amp; $v.user.password.$error"
              class="invalid-feedback-two"
            &gt;
              &lt;span v-if="!$v.user.password.required"&gt;Password is required&lt;/span&gt;
              &lt;span v-if="!$v.user.password.minLength"
                &gt;Minimum 8 character with
                          alphanumeric along with 1 capital letter, 1 small letter
                          and 1 special character at least&lt;/span
              &gt;
            &lt;/div&gt;
  
     &lt;input
              :type="passwordFieldTypetwo"
              v-model="user.confirmPassword"
              id="confirmPassword"
              name="confirmPassword"
              class="input-section-three"
              :class="{
                'is-invalid': submitted &amp;&amp; $v.user.confirmPassword.$error
              }"
              placeholder="Confirm password"
              :maxlength="maxconfirmpassword"
              v-on:keypress="isconfirmPassword($event)"
              :disabled="user.password.length &lt; 8"
            /&gt;
             &lt;div
              v-if="submitted &amp;&amp; $v.user.confirmPassword.$error"
              class="invalid-feedback-two"
            &gt;
              &lt;span v-if="!$v.user.confirmPassword.required"
                &gt;Confirm Password is required&lt;/span
              &gt;
              &lt;span v-else-if="!$v.user.confirmPassword.sameAsPassword"
                &gt;Password must match&lt;/span
              &gt;
            &lt;/div&gt;
            
   &lt;button             v-on:click="isWelcome = user.confirmPassword.length &gt;= 8"
   &gt; SUBMIT &lt;/button&gt;
    &lt;/div&gt;
    
     &lt;div  v-else-if="isWelcome"&gt;
   //some code for screen 4
   
    &lt;button&gt;Fine&lt;/button&gt;
    &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>The issue is, Initially if i click on submit button in screen3, validations are working fine but in the password confirmation field if i enter password which is not matching, but if exceed 8 characters. it is redirecting to 4th screen. But what i am trying to do is if password is matching with confirm password field then only need to redirect to 4th screen.</p>