@gaopeng123/login-module v1.3.7-alpha.1

login-module

登录模块，统一管理登录逻辑

属性配置

事件配置

（注意webpace5摇树配置会导致导入不可用时，请直接使用import ‘@gaopeng123/login-module’ 导入)

submit事件 在点击登录时触发，传递的登录信息在，detail字段中
afterSubmit 在登录数据下发服务端后触发 用于处理登录后的路由跳转等逻辑
submitError 在fetch出错情况下触发
captchaClick 在点击验证码的时候触发

<login-module
    url="/login"
    method="POST"
    publickey="*"
    user="userId"
    password="password"
    captcha="captcha"
    captchamethod="GET"
    captchaurl="/captcha"
    id="form"
    main-style="background-image: url(./assets/background.jpg)"
    body-style="right: 200px;"
    title="系统">
</login-module>

// 事件订阅
<script>
        const form = document.querySelector('#form');
    // 提交事件
    form.addEventListener('submit', (data)=> {
        console.log(data)
    });
    // fetch请求响应后
    form.addEventListener('afterSubmit', (data)=> {
        console.log(data)
    });
    // fetch请求失败后
    form.addEventListener('submitError', (data)=> {
        console.log(data)
    });
    // 点击验证码触发事件
    form.addEventListener('captchaClick', (data) => {
        console.log(data);
        form.setAttribute('captchasrc', '/iconfont/test.svg')   
    });
    // 密码重置
    form.addEventListener('resetPasswordSubmit', (data) => {
        console.log('resetPasswordSubmit', data);
        // 关闭窗口
        form.success();
    });
    /**
    * 短信验证码接口
    */
    form.addEventListener('sendSMSVerificationCode', (data) => {
        console.log('sendSMSVerificationCode', data);
    });
</script>

CSS variables

slot

tabs // 顶部
username-helper // 账号下方
footer // 底部