【uview2.0】Keyboard 键盘 与 CodeInput 验证码输入 结合使用 uview

https://www.uviewui.com/components/codeInput.html （CodeInput 验证码输入）
https://www.uviewui.com/components/keyboard.html （Keyboard 键盘）

<u-keyboard	
	mode="number" :dotDisabled="true" :show="show" 
	tips='密码为6位数字' confirmText='完成'
	closeOnClickOverlay
	@change="changeFun"
	@close="closeFun"
	@cancel="closeFun"
	@confirm='confirmFun'
	@backspace="backspaceFun"
	>
	<view class="flex_center u-bg-white u-p-t-40">
		<u-code-input v-model="value" dot></u-code-input>
	</view>
</u-keyboard>

// 按键被点击(不包含退格键被点击)
changeFun(e){
	// 最多输入6为数字
	if(this.value.length >= 6){
		return;
	}
	this.value += e;
},
// 键盘退格键被点击
backspaceFun(){
	this.value = this.value.slice(0, -1);
},
// 确定 密码键盘
confirmFun(){
	console.log('密码为：', this.value)
	this.show = false;
	this.value = '';
},
// 关闭 密码键盘
closeFun(){
	this.show = false;
	this.value = '';
},

css

.flex_center{
	display:flex; 
	align-items:center;
	justify-content:center;
}
.u-bg-white{
	background-color: #fff;
}
.u-p-t-40{
	padding-top:40rpx;
}