I found a helpful reference on How to validate password with Vuelidate?
validations: {
user: {
password: { required,
containsUppercase: function(value) {
return /[A-Z]/.test(value)
},
containsLowercase: function(value) {
return /[a-z]/.test(value)
},
containsNumber: function(value) {
return /[0-9]/.test(value)
},
containsSpecial: function(value) {
return /[#?!@$%^&*-]/.test(value)
},
minLength: minLength(8),maxLength: maxLength(19) },
confirmPassword: { required, sameAsPassword: sameAs("password") },
},
}<input
:type="passwordFieldType"
v-model="user.password"
v-model.trim="$v.user.password.$model"
id="password"
name="password"
class="input-section-three-login"
:class="{'is-invalid': validationStatus($v.user.password) }"
placeholder="Enter new password"
:maxlength="maxpassword"
v-on:keypress="isPassword($event)"
/>
<button v-on:click="registerMe" :disabled="user.confirmPassword != user.password " :class="(isDisabled) ? '' : 'selected'" > Register
</button>Looking for guidance on validating passwords with vuelidate using regex in the validationStatus and checking this validation on button click.
If the password passes the regex validation successfully, I want to move to the next screen. Otherwise, the user should remain on the current screen until successful validation occurs.