验证弹窗

需要加载的模块

  1. const eeui = app.requireModule('eeui');

eeui.swipeCaptcha

显示滑动验证码弹窗

预览效果

验证弹窗 - 图1

  1. /**
  2.  * @param imgUrl    自定义显示的图片
  3.  * @param callback  回调事件
  4.  */
  5. eeui.swipeCaptcha(imgUrl, callback(result))

示例代码

  1. <template>
  2.     <div class="app">
  4.         <text class="button" @click="swipeCaptcha">打开验证</text>
  6.     </div>
  7. </template>
  9. <style>
  10.     .app {
  11.         flex: 1;
  12.         justify-content: center;
  13.         align-items: center;
  14.     }
  15.     .button {
  16.         text-align: center;
  17.         margin-top: 20px;
  18.         padding-top: 20px;
  19.         padding-bottom: 20px;
  20.         padding-left: 30px;
  21.         padding-right: 30px;
  22.         color: #ffffff;
  23.         background-color: #00B4FF;
  24.     }
  25. </style>
  27. <script>
  28.     const eeui = app.requireModule('eeui');
  30.     export default {
  31.         methods: {
  32.             swipeCaptcha() {
  33.                 eeui.swipeCaptcha("", (res)=>{
  34.                     switch (res.status) {
  35.                         case "success":
  36.                             eeui.toast("验证成功");
  37.                             break;
  39.                         case "failed":
  40.                             eeui.toast("验证失败");
  41.                             break;
  42.                     }
  43.                 });
  44.             },
  45.         }
  46.     };
  47. </script>

imgUrl 参数说明

类型 必须 描述 默认值
String - 自定义显示的图片 -

callback 回调result说明

  1. {
  2.     pageName: '页面名称',
  3.     status: 'create',   //状态，详见：注①
  4. }

注①：

  • create页面创建完毕
  • destroy页面已销毁
  • success验证成功
  • failed验证失败

简单示例

  1. //示例①
  2. eeui.swipeCaptcha("", function(result) {
  3.     //......
  4. });
  6. //示例②
  7. eeui.swipeCaptcha('http://...../captcha.png', function(result) {
  8.     //......
  9. });