使用验证码框控件时，验证码长度为6位且弹窗显示时样式问题

[xu932045031]

Mand Mobile Version

1.6

Recurring Steps

在使用验证码窗控件时，验证码长度为6位且弹窗显示时验证码输入框超出dialog的宽度。

Expectant Behaviors

验证码长度6位时，验证码输入框不会超出弹框

Actual Behaviors

验证码长度6位时，验证码输入框会超出弹框

[yushi105]

按照 教程实例写的，Captcha submit 函数不执行呀，怎么回事

[xxyan0205]

Captcha submit 函数不执行呀

怎么用的？

[yushi105]

通过浏览器引入的方式，<md-captcha ref="captcha" v-model="isShow" :title="title" maxlength="6" mask="true" @submit="onSub" @show="onShow" @hide="onHide" @send="onSend"> {{content}} </md-captcha> js 里面 onSub 的方法，onSub (val) { console.log(val) setTimout(() =>{ // 执行自己的方发 }, 300) } isShow 为true时，onSub 都没执行，第一行都没打印

[yushi105]

通过浏览器引入的方式，<md-captcha
ref="captcha"
v-model="isShow"
:title="title"
maxlength="6"
mask="true"
@submit="onSub"
@show="onShow"
@hide="onHide"
@send="onSend">
{{content}}

js 里面 onSub 的方法，onSub (val) {
console.log(val)
setTimout(() =>{
// 执行自己的方发
}, 300)
}
isShow 为true时，onSub 都没执行，第一行都没打印

[yushi105]

Captcha submit 函数不执行呀

怎么用的？

通过浏览器引入的方式，<md-captcha
ref="captcha"
v-model="isShow"
:title="title"
maxlength=6
mask="true"
@submit="onSub"
@show="onShow"
@hide="onHide"
@send="onSend">
{{content}}

js 里面 onSub 的方法，onSub (val) {
console.log(val)
setTimout(() =>{
// 执行自己的方发
}, 300)
}
isShow 为true时，onSub 都没执行，第一行都没打印
maxlength 为-1时，点击键盘确定会执行，但是打印val 是undefined，那么怎么获取 输入的验证码呢

[supergaojian]

1、请确认您的mand-mobile版本号是否为v2.x
2、如果满足第一条，麻烦请提供可完整复现的最小代码
谢谢

[zouhangwithsweet]

http://jsbin.com 来个 demo 吧

[yushi105]

1、请确认您的mand-mobile版本号是否为v2.x
2、如果满足第一条，麻烦请提供可完整复现的最小代码
谢谢
版本为最新2.5.3

<title>mand mobile 学习</title> <style> [v-clock]{ display: none !important; } *{ padding:0; margin: 0; } .btn{ width: 100%; height: 40px; } </style>

Captcha

{{contentMsg}}

<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script> <script src="js/mand.min.js"></script> <script> var app = new Vue({ el: '#app', data: { isCaptcha: false, contentMsg: '验证码已发送至 152 **** 0000', }, created() { }, methods: { onSub (val) { console.log('走入onSub函数------') setTimeout(() => { if (val.length === 6) { console.log(val) this.isCaptcha = false } else { console.log(val) } }, 300); }, onShow () {console.log('onShow');}, onHide () {console.log('onHide');}, onSend () {console.log('onSend');}, } }) </script>

[supergaojian]

为了更好的方便您反馈描述问题，请添加mand mobile官方交流QQ群：493305323。我们会有人帮您解决问题