ant desgin 登陆实现带接口

最新推荐文章于 2021-12-31 14:08:07 发布

niersen丶尼尔森

最新推荐文章于 2021-12-31 14:08:07 发布

阅读量743

点赞数

分类专栏：笔记文章标签： ant desgin react

本文链接：https://blog.csdn.net/Neil_1993/article/details/90763438

版权

本文详细介绍了如何在React项目中使用Ant Design框架实现登录功能，并与后端接口进行对接。通过实例代码展示从用户输入验证到发送请求，再到接收响应并处理登录状态的全过程。

摘要由CSDN通过智能技术生成

import React, { Component } from 'react';
import { Form, Icon, Input, Button } from 'antd';
import './Login.css';


    class Login extends React.Component {
      constructor(props){
        super(props);
        this.state = {
          userName:'',
          pswd:''
        }
    }

    userChange(e){
    this.setState({
      userName:e.target.value,
      })
      // console.log(this.state.userName);
    }

    pswdChange(e){
      this.setState({
        pswd:e.target.value,
        })
        // console.log(this.state.pswd);
    }

    submitChange(e){

      let param= "tel="+this.state.userName+"&paswd="+this.state.pswd;

      fetch('http://123.206.254.55/Garaer/garaerServer/index.php/User/login',{
            method: 'POST',
            body: param,
            headers: {
              'Content-Type': 'application/x-www-form-urlencoded