ShortPassword 短密码请使用手机扫码体验

底部弹出短密码

  1. html
    <nut-shortpassword
  2.     :visible="isShow"
  3.     @close = "shortpwdClose"
  4.     type = "bottom"
  5.     link = "https://m.jd.com"
  6. >
  7. </nut-shortpassword>

居中弹出短密码

  1. html
    <nut-shortpassword 
  2.     :visible="isShow2"
  3.     @close="shortpwdClose2"
  4.     type="center"
  5. ></nut-shortpassword>
  1. javascript
    export default {
  2.     data(){
  3.         return{
  4.             isShow:false,
  5.             isShow2:false,
  6.             val1:'',
  7.             val2:''
  8.         }
  9.     },
  10.     methods:{
  11.         shortpwdClose(val){
  12.             if(val) this.val1 = val;
  13.             this.isShow = false;
  14.         },
  15.         shortpwdClose2(val){
  16.                 if(val) this.val2 = val;
  17.             this.isShow2 = false;
  18.         },
  19.         showShortpwd(){
  20.             this.isShow = true;
  21.         },
  22.         showShortpwd2(){
  23.             this.isShow2 = true;
  24.         },
  27.     }
  28. }

Prop

字段说明类型默认值
visible是否显示短密码Booleanfalse
link忘记密码跳转链接String'javascript:;'
type短密码样式类型String'bottom'

Event

字段说明回调参数
close关闭短密码框val