class Clock extends React.Component {
state = { time: new Date().toLocaleTimeString() };
componentDidMount() {
setInterval(() => {
this.setState = ({ time: new Date().toLocaleTimeString()})
}, 1000)
}
render() {
return (
<div className="time">
the time is :{this.state.time}
</div>
);
}
};
this is a simple clock react app where ComponentDidMount is not working
3 Réponses :
SetState est une fonction: < Pré> xxx
STSTET () EnQuues modifie l'état du composant et indique réagir que ce composant et ses enfants doivent être re-rendus avec l'état mis à jour.
SetState est une fonction, elle doit être invoquée, non attribuée. N'oubliez pas non plus de supprimer la minuterie sur la démontie pour empêcher la fuite de mémoire Voici l'exemple de travail
Eh bien, l'ensemble de l'ensemble appellera certaines desecyclettes de ce composant, reportez-le et rendant tous les enfants de cette composante Au fait, voici un exemple de travail https://codesandbox.io/s/blazing-resonance-kjoyi
import React, { useRef, useEffect } from "react";
const Clock = () => {
const ref = useRef();
useEffect(() => {
setTimer();
const timer = setInterval(setTimer, 1000);
return () => {
clearInterval(timer);
};
}, []);
const setTimer = () => {
ref.current.innerText = new Date().toLocaleTimeString();
};
return (
<div className="App">
time is : <span ref={ref} />
</div>
);
};
export default Clock;