How do I use Vuelidate with a custom validator? - vue.js

Question

I’m trying to validate a 6 digit code with vuelidate. If this.validationcode equals false I want to show a validation error. I'm pretty new to vue so I'm not entirely sure where I'm going wrong. How do I get this to work?
The error I get is:
TypeError: Cannot read property '__isVuelidateAsyncVm' of undefined
JS
data() {
return {
validationcode: false,
validationRules: [
{ vcode: {
required,
numeric,
minLength: minLength(6),
maxLength: maxLength(6),
validCode () { return this.validationcode }
} },
],
};
},
I also tried it as an arrow function but it doesn't get the value properly from the looks of it.
validCode: () => {
console.log("the val code is " + this.validationcode)
return this.validationcode
}
HTML - v.formData.vcode.validCode - In the current front end view, this rule is triggered every time.
<div class=“form-group”>
<input
type=“text”
class=“form-control”
:class=“hasError(‘vcode’) ? ‘is-invalid’ : ‘’”
placeholder=“Enter your 6 digit code”
v-model=“formData.vcode”
/>
<div v-if=“hasError(‘vcode’)” class=“invalid-feedback”>
<div class=“error” v-if=“!$v.formData.vcode.required || !$v.formData.vcode.minLength || !$v.formData.vcode.maxLength”>
Enter your 6 digit code
</div>
<div class=“error” v-if=“!$v.formData.vcode.numeric”>
Should be a valid value.
</div>
<div class=“error” v-if=“!$v.formData.vcode.validCode”>
Code incorrect, please try again.
</div>
</div>
</div>
This is the method that I am assigning true/false to this.validationcode.
verifyNumber() {
var numbers = /^[0-9]+$/;
if (code.match(numbers)) {
// Twilio functions do not accept multipart/form-data
const data = new URLSearchParams();
data.append("phone_number", m.mobileNumber);
data.append("verification_code", code);
fetch("https://saffron-cheetah-1234.twil.io/check", {
method: "POST",
body: data,
})
.then((response) => response.json())
.then((json) => {
if (json.success) {
console.log("Successfully verified the token.");
this.validationcode = true;
} else {
this.validationcode = false;
console.log(this.validationcode);
console.log("Incorrect token.");
}
})
.catch((err) => {
console.log(err);
});
} else {
}
},