javascript - vue如何让组件处理登录逻辑?

查看:155
本文介绍了javascript - vue如何让组件处理登录逻辑?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

登录页面: login.vue

<template>
    <div>
        <img src="../assets/logo.png">
        <pub-header :pmsg="title"></pub-header>
        <input-text :input_name="input_username"></input-text>
        <input-text :input_name="input_password"></input-text>
        <btn-login></btn-login>
    </div>
</template>

组件:inputText

<template>
    <a class="mint-cell mint-field">
        <div class="mint-cell-left"></div>
        <div class="mint-cell-wrapper">
            <div class="mint-cell-title">
                <span class="mint-cell-text">{{input_name}}</span>
            </div>
            <div class="mint-cell-value">
                <input :placeholder="input_placeholder" type="text" class="mint-field-core" maxlength="10">
                <div class="mint-field-clear" style="display: none;">
                    <i class="mintui mintui-field-error"></i>
                </div> 
                <span class="mint-field-state is-default">
                    <i class="mintui mintui-field-default"></i>
                </span>
                <div class="mint-field-other"></div>
            </div>
        </div>
        <div class="mint-cell-right"></div>
    </a>
</template>

<script>
    import Vue from 'vue'
    import MintUI from 'mint-ui'
    import 'mint-ui/lib/style.css'
    Vue.use(MintUI)

    export default {
        name: 'inputText',
        data() {
            return {
                msg: ''
            }
        },
        props: {
            input_name: {
                default:'账号'
            },
            input_placeholder: {
                default:'请输入该字段'
            },
        }
    }
</script>

本人初学者,想写个demo练习一下vue2.0
我想两个组件完成各自的验证(比如一个验手机,一个验邮箱,但ui是一样的),然后给出返回值登录
请问如何实现这样的登录方法,给个思路即可
或者说我这么写根本就不对,还有更好的方法,也麻烦推荐下,扔个链接也行,谢谢!!

解决方案

我前段时间总结的一个项目,或许能帮助你理解这个过程。
【vue+axios】一个项目学会前端实现登录拦截

这篇关于javascript - vue如何让组件处理登录逻辑?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆