加上withcredentials: true后,依旧实现不了刷新后,获取正确登录状态

加上withcredentials: true后,依旧实现不了刷新后,获取正确登录状态

import React, { Component } from 'react'

import { Button, Modal, Input, message } from 'antd'

import { Link } from 'react-router-dom'

import axios from 'axios'

class Login extends Component {
    constructor(props) {
        super(props)
        this.state = {
            login: false,
            modal: false,
            userNumber: '',
            password: ''
        }
        this.showModal = this.showModal.bind(this)
        this.handleLogin = this.handleLogin.bind(this)
        this.handleCancle = this.handleCancle.bind(this)
        this.changeUserNumber = this.changeUserNumber.bind(this)
        this.changePassword = this.changePassword.bind(this)
    }
    showModal() {
        this.setState({
            modal: true
        })
    }
    handleLogin() {
        let url = `http://www.dell-lee.com/react/api/login.json?user=${this.state.userNumber}&password=${this.state.password}`
        axios.get(url, {
            withcredentials: true
        }).then(res => {
            if (res.data.data.login) {
                message.success('登录成功')
                this.setState({
                    login: true,
                    modal: false
                })
            } else {
                message.error('登录失败,请检查账户密码是否正确')
            }
        })
    }
    handleCancle() {
        this.setState({
            modal: false
        })
    }
    changeUserNumber(e) {
        this.setState({
            userNumber: e.target.value
        })
    }
    changePassword(e) {
        this.setState({
            password: e.target.value
        })
    }
    componentDidMount() {
        axios.get('http://www.dell-lee.com/react/api/isLogin.json', {
            withCredentials: true
        }).then(res => {
            let { login } = res.data.data
            this.setState({ login })
        })
    }
    render() {
        return (
            <div>
                <div style={{ marginBottom: 10 }}>
                    {this.state.login ?
                        <Button type="primary">退出</Button> :
                        <Button type="primary"
                            onClick={this.showModal}
                        >登录</Button>

                    }
                    <Link to="/vip" style={{marginLeft:10}}>
                        <Button type="primary"
                        >Vip</Button>
                    </Link>
                </div>
                <Modal
                    title="登录"
                    visible={this.state.modal}
                    onOk={this.handleLogin}
                    onCancel={this.handleCancle}
                >
                    <Input placeholder="请输入用户名"
                        style={{ marginBottom: 10 }}
                        value={this.state.userNumber}
                        onChange={this.changeUserNumber} />
                    <Input.Password
                        placeholder="请输入密码"
                        value={this.state.password}
                        onChange={this.changePassword} />
                </Modal>
            </div>
        )
    }
}

export default Login


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

2回答
好帮手慕码 2020-06-09 18:54:14

同学你好,是的,handleLogin方法中单词withCredentials中的C应该是大写。可以自己找到问题棒棒哒。继续加油,祝学习愉快~

提问者 精慕门8328450 2020-06-09 17:20:02

朋友,大小写写错了吧

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师