Javascript 注销然后登录后不显示数据-reactjs

我在登录/注销时遇到问题，然后在表单中显示数据。如果我重新启动服务器并在不注销的情况下登录，它将工作并显示数据。但是，如果我登录，然后注销，然后再次登录，则

useffect

中的数据似乎花费的时间太长，并且不会显示在表单中

这是我的登录名：

export const login = (email, password ) => async dispatch => {
    const config = {
        headers: {
            'Content-Type':'application/json'
        }
    }
    const body = JSON.stringify({email, password})
    try{
        const res = await axios.post('/api/auth/login', body, config)
        dispatch({
            type: LOGIN_SUCCESS,
            payload: res.data
        })

        dispatch(loadUser())
    } catch (e){
        let errors = e.response.data;
        console.log(errors)

        if(errors) {
            dispatch(setAlert(errors.message, 'danger'))
        }
        dispatch({
            type: LOGIN_FAIL
        })
    }
}

这是我的注销：

export const logout = (history) => dispatch => {
    dispatch ({ type: CLEAR_PROFILE })
    dispatch ({ type: LOGOUT })
    history.push('/proveedores')
}

这是我获取数据的方式：

export const getCurrentProfile = () => async dispatch => {
    try{
        const res = await axios.get('/api/usuarios/me')
        dispatch({
            type: GET_PROFILE,
            payload: res.data
        })
    } catch (e) {
        dispatch({
            type: PROFILE_ERROR,
            payload: {msg: e.response.message}
        })
    }

}

这是我的组成部分：

useEffect(() => {
        getCurrentProfile()
        setFormData({
             nombres: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.nombres ,
             apellidos: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.apellidos ,
             email: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.email ,
             telefono: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.telefono ,
             ruc: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.ruc ,
             razon_social: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.razon_social ,
             sector_negocio: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.sector_negocio,
             bio: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.bio ,
             direccion: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.direccion ,
             facebook: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.social.facebook ,
             twitter: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.social.twitter ,
             linkedin: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.social.linkedin ,
             instagram: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.social.instagram ,
             website: loading || !profile || profile == undefined || profile == '' || profile == null ? '' : profile.data.website ,

         })   

         let completeFieldsCounter = 0

         if(user){

            if(user.nombres !== '' && user.nombres !== null && user.nombres !== undefined) completeFieldsCounter++
            if(user.apellidos !== '' && user.apellidos !== null && user.apellidos !== undefined) completeFieldsCounter++
            if(user.email !== '' && user.email !== null && user.email !== undefined) completeFieldsCounter++
            if(user.telefono !== '' && user.telefono !== null && user.telefono !== undefined) completeFieldsCounter++
            if(user.ruc !== '' && user.ruc !== null && user.ruc !== undefined) completeFieldsCounter++
            if(user.razon_social !== '' && user.razon_social !== null && user.razon_social !== undefined) completeFieldsCounter++
            if(user.sector_negocio !== '' && user.sector_negocio !== null && user.sector_negocio !== undefined) completeFieldsCounter++
            if(user.bio !== '' && user.bio !== null && user.bio !== undefined) completeFieldsCounter++ 
            if(user.direccion !== '' && user.direccion !== null && user.direccion !== undefined) completeFieldsCounter++

        }

        if(completeFieldsCounter == 9 ){
            setShow(false)
        } else {
            setShow(true)
        }

    }, [loading])


return loading && !profile ? <Spinner /> : <Fragment>
    <Modal centered show={show} onHide={handleClose}>
        <Modal.Header closeButton>
            <Modal.Title>Recordatorio <i class="modal-bulb-profile far fa-lightbulb"></i></Modal.Title>
        </Modal.Header>
        <Modal.Body>Para poder figurar como proveedor necesitas completar los datos de tu empresa.</Modal.Body>
        <Modal.Footer>
            <button onClick={handleClose}>Cerrar</button>
        </Modal.Footer>
    </Modal>
    <div className="perfil-proveedor">
        <div className="perfil-saludo">
            <h1>Hola, <span>{nombres+' '+apellidos}</span></h1>
        </div>
        <ProgressBar animated now={emptyFieldsCounter} />
        <div className="perfil-progress-status">
            <p>Tu perfil está al {emptyFieldsCounter} %</p>
        </div>
        <div className="perfil-editar-btn">
            <button onClick={() => disableBtn()}>Editar</button>
        </div>
        <Alert/>
        <div className="perfil-form">
            <form onSubmit={e => onSubmit(e)}>
                <div className="perfil-datos">
                    <div className="perfil-field perfil-email" >
                        <label className="col-5 no-margin no-padding" htmlFor="email">Email</label>
                        <input className="col-7 no-margin no-padding" type="text" name="email" disabled={disabled} value={email} onChange={ (e) => onChange(e)}/>
                    </div>
    </div>
                </form>
            </div>
        </div>
        </Fragment>

useffect（（）=>{
getCurrentProfile（）
setFormData({
nombres:loading | | | | profile==未定义的| | profile=''| | profile==null？''：profile.data.nombres，
apellidos:loading | | | | | profile==未定义| | profile=''| | profile==null？''：profile.data.apellidos，
电子邮件：正在加载| |！profile | | profile==未定义| | profile==''| | profile==null？''：profile.data.email，
telefono:loading | |！profile | | profile==未定义的| | profile=''| | profile==null？''：profile.data.telefono，
ruc:loading | |！profile | | profile==未定义的| | profile=''| | profile==null？''：profile.data.ruc，
razon|u social:loading | | | | | profile==未定义| | profile=''| | | profile==空？''：profile.data.razon|u social，
扇区| negocio:loading | | | | | profile==未定义| | profile=''| | profile==null？''：profile.data.sector | negocio，
bio:loading | |！profile | | profile==未定义的| | profile==''| | profile==null？''：profile.data.bio，
目录：加载| |！profile | | profile==未定义的| | profile==''| | profile==null？''：profile.data.direccion，
facebook:loading | |！profile | | profile==未定义| | profile==''| | profile==null？''：profile.data.social.facebook，
twitter:loading | |！profile | | profile==未定义的| | profile==''| | profile==null？''：profile.data.social.twitter，
linkedin:loading | |！profile | | profile==未定义| | profile=''| | profile==null？''：profile.data.social.linkedin，
instagram:loading | |！profile | | profile==未定义| | profile=''| | profile==空？''：profile.data.social.instagram，
网站：加载| |！profile | | profile==未定义| | profile==''| | profile==null？''：profile.data.website，
})   
设CompleteFieldCounter=0
如果（用户）{
如果（user.nombres！=''&&user.nombres！==null&&user.nombres！==undefined）完成字段计数器++
如果（user.apellidos！=''&&user.apellidos！==null&&user.apellidos！==未定义）完成字段计数器++
如果（user.email！=''&&user.email！==null&&user.email！==未定义）完成字段计数器++
如果（user.telefono！=''&&user.telefono！==null&&user.telefono！==未定义）完成字段计数器++
如果（user.ruc！=''&&user.ruc！==null&&user.ruc！==未定义）完成字段计数器++
如果（user.razon\u social！=''&&user.razon\u social！==null&&user.razon\u social！==未定义）完成字段计数器++
如果（user.sector\u negocio！=''&&user.sector\u negocio！==null&&user.sector\u negocio！==未定义）完成字段计数器++
如果（user.bio！=''&&user.bio！==null&&user.bio！==未定义）完成字段计数器++
如果（user.direcion！=''&&user.direcion！==null&&user.direcion！==未定义）完成字段计数器++
}
如果（CompleteFieldCounter==9）{
设置显示（假）
}否则{
设置显示（真）
}
}，[加载]）
返回装载&！个人资料？：
录音室
这是一个很好的例子，它是一个必要的综合设施。
塞拉
你好，{nombres+''+apellidos}
你的成绩是{emptyFieldsCounter}%

disableBtn（）}>Editar
onSubmit（e）}>
电子邮件
onChange（e）}/>

我没有粘贴整个组件，因为它太多了，但它只是重复输入

---

我需要一种方法来修复注销后登录时丢失的数据。

我以前也遇到过同样的问题。我认为在

useffect

函数末尾的数组中放置了什么内容存在问题。但很难从给出的信息中准确判断

首先，它只显示Redux

操作

，因此请检查有关您的登录/注销案例的

还原程序

。这是因为您将

loading

放入

useffect

数组中，这意味着每当您的

loading

状态发生变化时，它都会触发

useffect

，因此您的

loading

状态可能不稳定或有问题。这可能是您的

useffect

加载时间长（反复运行）的原因之一如果你出于某种原因故意把货物放在那里

接下来，尝试从数组中删除

load

，只将

getCurrentProfile

放在数组中（不是函数，而是我写的）

useffect（（）=>{
getCurrentProfile（）；
}，[getCurrentProfile]）

这意味着除非调用

getCurrentProfile

=use one，否则不会触发useEffect

如果使用此优化，请确保数组包含组件范围中随时间变化且效果使用的所有值（如道具和状态）。否则，代码将引用以前渲染中的过时值。了解更多有关如何处理函数和要处理的内容