vue制作短信验证码输入框

先上最终效果 （此处代码显示的是短信验证码框的效果   其余部分并未放上去）

html

js

	    data (){
            return {       
              smsCode:'',
		      code:new Array(5),
		      codeId:['first','second','third','forth','fifth']
            }
	    },
       			watch:{
				code:function(newValue,oldValue){
					console.log('newValue.length'+newValue.length)
					let tempValue=''
					for(let i=0;i5){
						location=5
					}
					document.getElementById(this.codeId[location-1]).focus()
				}
			},

 

CSS

.inputStyle{
	width:20%;
	height:100%;
	text-align:center;
	border:none;
}