[dpts]

Приветствую. Может кто-нибудь подскажет где собака порылась.

Имеем допустим функцию:

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);
}

То все срабатывает как надо, с первого раза.
Но так уж вышло, что мне эта проверка нужна именно там.

Может быть может кто-то объяснить почему так, где собака порылась и как исправить, чтобы с первого раза срабатывало?