Mobile development Specification--registration module react

Login registration, React wrote. Registration is mainly to obtain authentication code, verification code verification, registration password.

Module code:

Verification Code:

        Return (
            <div classname= "Um-win" >
                <validateuser
                    type={' register '}
                    id={' Registerpwd '}
                    url={' comps/summer-component-login/www/html/registerpwd.html '}
                    serverurl={'/auth/checkvalidatorcode '}
                    />

            </div>

        )
    }

ValidateUser

        Ajax ({type: ' post ', url: '/auth/sendvalidatorcode ', param:param}, F
            Unction (res) {Console.log (res);
                        if (Res.flag = = 0) {if (Self.props.type = = ' Forget ') {self.setstate ({
            UserId:res.data.userId})} summer.toast ({msg: ' Send authentication code succeeded '});
                }else {summer.toast ({msg:res.msg});
                Targetdom.classname= ' Get-pwd btn ';
                Targetdom.disabled=false;
                Targetdom.innerhtml= "Obtain the authentication code";
                Clearinterval (Intervaltimer);
                SELF.GETIMGSRC ();
            Self.setstate ({imgcontent: '}}}, function (err) { Let Message=err.error?
            Err.error: ' request error ';
            Summer.toast ({msg:message});
            Targetdom.classname= ' Get-pwd btn '; Targetdom.disaBled=false;
            Targetdom.innerhtml= "Obtain the authentication code";
            Clearinterval (Intervaltimer);
            SELF.GETIMGSRC ();
        Self.setstate ({imgcontent: '})}}/* Check-click to get Authentication code */Beforegetcode () {
        Let rephone=/^1\d{10}$/;
            if (this.state.imgContent = = "") {Summer.toast ({msg: ' Please enter the graphics and text Verification Code '});
        return false;
            } if (This.state.phone = = "") {Summer.toast ({msg: ' Please enter your mobile number '});
        return false;
            } if (!rephone.test (This.state.phone)) {Summer.toast ({msg: ' cell phone number is not in the correct format '});
        return false;
    return true;
        Handlebtnclick= (e) =>{e.preventdefault ();
        E.stoppropagation ();
        if (this.props.type== ' Bindaccount ') {this.bindaccount ();
        }else {this.validatecode (); }
    }

Omit the other background call code (almost) here ...
Html

    Render () {Let btntext=this.props.btntext this.props.btnText: ' Next ';
                        Return (<div classname= "um-content" > <div classname= "Um-input-text" > <input type= "text" classname= "Form-control" placeholder= "Please enter your mobile number" Value={this.state.phone} onchange= {(e) =>this.handlerchange (' phone ', e)}/> </div> <div classname= "um-i Nput-text PR "> <input type=" text classname= "Form-control" placeholder= "Graphics Verification Code" VALUE={THIS.S Tate.imgcontent} onchange={(e) =>this.handlerchange (' Imgcontent ', e)}/> <div "im G-container "onclick={(e) =>this.getimgsrc (e)}>  </div> </div> <spa n classname= "Friendly-tips" > can't see clearly. Click to switch Pictures </span>
                    <div classname= "Get-pwd-box" > <input type= "Text" placeholder= "6-bit SMS verification Code "classname=" Form-control msg-input "onchange={(e) =>this.handlerchange (' phonemsg ', e)}/> Button Classname= "Get-pwd btn" onclick={(e) =>this.getverifycode (e)}> get Authenticode </button> </d iv> <button classname= "um-btn go-next-step" onclick={(e) =>this.handlebtnclick (e)}>{btnText }</button> </div>)}

Registered:

    Render () {return
        (
            <div classname= "Um-win" >
                <validatepwd
                    buttontext={"register"}
                    type={ Register '}
                    contact={this.state.contact}
                    serverurl={'/auth/register '}
                    />
            </div>

        )
    }

VALIDATEPWD module:

        Ajax ({type: ' Post ', Url:this.props.serverUrl, Param:param}, Functi
            On (res) {Console.log (res); if (Res.flag = = 0) {if (Self.props.type = = ' Register ') {/* The registration will return the token value to facilitate the next step to improve user information
                    * * var userinfo = {Token:res.data};
                    Summer.setstorage (' UserInfo ', userinfo);
                    Summer.toast ({msg: ' registered successfully '});

                Summer.closewin ();
                    else if (Self.props.type = = ' Forget ') {Summer.toast ({msg: ' Password modified successfully '});
                Summer.closewin ();
                } else if (Res.flag = 1) {summer.toast ({msg:res.msg});
            Summer.closewin ();
                else {var message = Res.msg res.msg: ' request error ';
                Summer.toast ({msg:message}); Summer.closewiN ();
            The function (Err) {var message = Err.error err.error: ' request error ';
            Summer.toast ({msg:message});
        Summer.closewin (); });

Html:

    Render () {return
        (
                <div classname= "um-content" >
                    <div classname= "Um-input-text" >
                        < Input type= "password" classname= "Form-control" placeholder= "Set Password" onchange={(e) =>this.handlechange (' pwd ', e)}/ >
                    </div>
                    <div classname= "Um-input-text" >
                        <input type= "password" classname= " Form-control "placeholder=" Confirmation password onchange={(e) =>this.handlechange (' Newpwd ', e)}/>
                    </div>
                    < Button Classname= "Um-btn go-next-step" onclick={(e) =>this.clickregister (e)}>{this.props.buttontext}</ button>
                </div>
        )
    }

Starting tomorrow the synthesis of JS code, guarantee the premise of the function, code specifications, annotations clear, Easy-to-use, interface finishing.