登录弹框(wap)

基于Vue.js 的 前端业务组件。

案例演示

<div class="demo-box">
  <button type="button" name="button" @click="click">登录</button>
  <w-login-wap :show="show" :close="close" :success="success" orgid="100253" :countrycodeAction="countrycodeAction" :sendAction="sendAction" :loginAction="loginAction"></w-login-wap>
</div>
import WLoginWap from './index';

export default {
  data() {
    return {
      value1: {},
      show: false,
      countrycodeAction: 'https://www.easy-mock.com/mock/5ab386ecca15e11ded65b593/chinese/countrycode',
      sendAction: 'https://www.easy-mock.com/mock/5ab386ecca15e11ded65b593/chinese/smssend',
      loginAction: 'https://www.easy-mock.com/mock/5ab386ecca15e11ded65b593/chinese/login',
    }
  },
  components: {
    WLoginWap,
  },
  mounted() {
    document.getElementsByTagName('html')[0].className = 'html';

    setTimeout(() => {
      console.log('数据录入');
      this.value1 = {
        name: '中国',
        tel: '13800138000',
        prefix: '86',
        url: 'https://static.evente.cn/evente/img/flag/v1/zg.jpg',
      }
    }, 2000);
  },
  beforeDestroy() {
    document.getElementsByTagName('html')[0].className = '';
  },
  methods: {
    click() {
      this.show = true;
    },
    close(val) {
      this.show = val;
    },
    success(res) {
      console.log(res, '登录');
    },
  },
}

如何使用

使用 <w-login-wap /> 标签声明组件,指定图标对应的 type 属性,示例代码如下:

<w-login-wap></w-login-wap>

API

参数说明类型是否必填默认值
title自定义标题 0.4.0 新增。String是请完善手机信息
value定义数据 0.5.0 新增。String是无
show控制弹框显示Boolean是false
org_id主办idString是-
countrycodeAction获取countrycode接口地址String是-
sendAction发送验证码接口地址String是-
domain设置cookie登录状态的domainString否'evente.cn'
loginAction用户登录接口地址String是-
close关闭弹框Function是() => {}
success登录成功Function是() => {}
desc自定义描述 0.6.0 新增String是成功短信将发送至该手机
telPlaceholder手机号 placeholder 0.6.0 新增String是输入手机号
smsPlaceholder验证码 placeholder 0.6.0 新增String是输入验证码
smsBtnText验证码按钮默认 0.6.0 新增String是获取验证码
telFormatErrorText手机号格式有误 文案 0.6.0 新增String是手机号格式有误
telEmptyText手机号为空 文案 0.6.0 新增String是输入手机号
sendingText验证码获取中 文案 0.6.0 新增String是获取中
subingText点击确定提交中 文案 0.6.0 新增String是正在提交...
btnText提交按钮默认 文案 0.6.0 新增String是确定