Avertissement: ne Peut pas appeler setState (ou forceUpdate) sur un composant démonté
Je reçois cet avertissement chaque fois que je me connecte,
Avertissement: ne Peut pas appeler setState (ou forceUpdate) sur une démonté
composante. C'est un no-op, mais il indique une fuite de mémoire dans votre
application. Pour corriger, annuler tous les abonnements et les tâches asynchrones
dans le componentWillUnmount méthode.
Voici mon code:
authpage.js
handleLoginSubmit = (e) => {
e.preventDefault()
let { email,password } = this.state
const data = {
email : email,
password : password
}
fetch('http://localhost:3001/auth/login',{
method : 'post',
body : JSON.stringify(data),
headers : {
"Content-Type":"application/json"
}
}).then(res => res.json())
.then(data => {
if(data.success){
sessionStorage.setItem('userid',data.user.id)
sessionStorage.setItem('email',data.user.email)
}
this.setState({loginData : data,
userData : data,
email:"",
password:""})
if(data.token) {
Auth.authenticateUser(data.token)
this.props.history.push('/dashboard')
}
this.handleLoginMessage()
this.isUserAuthenticated()
})
}
export default withRouter(AuthPage)
utilisation withRouter
afin que je puisse accéder à des accessoires que j'utilise pour naviguer this.props.history.push('/dashboard')
si je n'ai pas utilisé withRouter je ne peux pas y accéder.accessoires
index.js
const PrivateRoute = ({ component : Component, ...rest }) => {
return (
<Route {...rest} render = { props => (
Auth.isUserAuthenticated() ? (
<Component {...props} {...rest} />
) : (
<Redirect to = {{
pathname: '/',
state: { from: props.location }
}}/>
)
)}/>
)
}
const PropsRoute = ({ component : Component, ...rest }) => (
<Route {...rest} render = { props => (
<Component {...props} {...rest} />
)}/>
)
const Root = () => (
<BrowserRouter>
<Switch>
<PropsRoute exact path = "/" component = { AuthPage } />
<PrivateRoute path = "/dashboard" component = { DashboardPage } />
<Route path = "/logout" component = { LogoutFunction } />
<Route component = { () => <h1> Page Not Found </h1> } />
</Switch>
</BrowserRouter>
)
Je pense que le problème est avec mon withRouter,
comment peut-on accéder à ce.accessoires sans l'aide de withRouter ?
Vous devez vous connecter pour publier un commentaire.
Il est asynchrone, donc
faire d'erreur
Vous pouvez utiliser cette._mount pour vérifier composant est monté ou démonter
Vous pouvez utiliser
_isMount
avec la surcharge de l'setState
fonction:J'ai eu quelques problèmes à l'aide de
this.setState({ any })
.Chaque fois que le composant a été construit, il appelle une fonction qui utilisé Axios et la réponse apportée par un
this.setState({ any })
.Mon problème a été résolu comme suit:
Dans le
componentDidMount()
fonction que j'appelle une autre fonction appeléeinitialize()
que j'ai laissé comme async et, à travers elle, je peux appeler ma fonction qui effectue l'extraction etthis.setState({ any })
.