登录（学习笔记）

//这是一个组件
<div className="login_btn center">
  <Button 
  style={{width:'100%',height:'42px',backgroundColor: '#fff',color: '#03030'}} 
  title="登录" 
  onClick={this.loginEvent.bind(this)}/>
</div>

<div 
    onClick={() => this.props.onClick && this.props.onClick()}
    className="button center" 
    style={this.props.style}>
    { this.props.title || '默认按钮' }
</div>

//点击登录
loginEvent() {
    //路径 我这里写的是一部分路径
    let url = "/admin/login";
    let form = new FormData();
    let username;
    let password;
    var _this = this;
    //当用户名和密码在本地存储时，执行getUserInfo()
    localStorage.getItem('username') && localStorage.getItem('password') && getUserInfo()
    //此函数的作用是，取出localStorage存储的用户名和密码
    getUserInfo(){
        username = localStorage.getItem('username');
        password = localStorage.getItem('password');
    }
    //得不到用户名和密码任何一个时，就执行dealUserInfo函数
    (!localStorage.getItem('username) || !localStorage.getItem('password')) && dealUserInfo()
    //得到初始化的用户名和密码
    dealUserInfo(){
        username = _this.state.username;
        password = _this.state.password;
    }
    form.append('username',username);
    form.append('password',password);

    return fetch(url,{
        method: 'POST',
        body: form
    }).then(res=>{
        //
        localStorage.setItem('jwt_token',data.headers.get('jwt_token'));
        return res.json()
    }).then(data=>{
        //
        loalStorage.getItem('user',JSON.stringify(data));
        if(data.enabled){
            localStorage.getItem("username",this.state.username);
            localStorage.getItem("password",this.state.password);
            this.props.history.replace('/home');
        }
    })
}

进入登录页面时，获取密码

getLocalStorage(){
    var username = localStorage.getItem('username');
    var password = localStorage.getItem('password');

    username && password && this.setState({
        username: username,
        password: password
    })
}

componentDidMount(){
    this.getLocalStorage()
}