Приветствую. Может кто-нибудь подскажет где собака порылась.
Имеем допустим функцию:
function test(str){
console.log(str);
var pattern = /^\+\d{11}$/g;
if (str.length > 12){
str=str.substr(0,12);
}
console.log(str);
console.log(pattern.test(str));
return pattern.test(str);
}
если ей скормить +12345678901 или +123456789011 она вернет true
Пытаюсь завернуть ее в VUE.JS:
var vm = new Vue({
el: '#app',
data () {
v:'+12345678901',
max: 12,
pattern: /^\+\d{11}$/g
},
computed:{
valid: function(){
if (this.v.length > this.max){
this.v = this.v.substr(0,this.max);
}
return this.pattern.test(this.v);
}
},
watch:{
v: function(){
if (this.v.length > this.max){
this.v = this.v.substr(0,this.max);
}
}
}
});
если в VUE dev tools меняю v на +123456789011, последняя единица отрезается, что логично, но valid стает false.
Тут-же еще раз меняю v на +123456789011, последняя единица отрезается и valid стает true.
и так по кругу. То-есть при заворачивании функции в vue регекспов .test() начинает срабатывать через раз.
При этом, если из функции, формирующей valid убрать проверку на количество символов
if (this.v.length > this.max){
this.v = this.v.substr(0,this.max);
}
То все срабатывает как надо, с первого раза.
Но так уж вышло, что мне эта проверка нужна именно там.
Может быть может кто-то объяснить почему так, где собака порылась и как исправить, чтобы с первого раза срабатывало?