How to update the data with react js eg a user writes a comment how to make this messages show up to all other users? I used setState in componentDidUpdate with a stop condition but it doesn't work. If i don't make a condition, it work correctely but with infinite loop.
componentDidUpdate(prevProps, prevState) {
console.log("1" + prevState.changeRepComm.toString())
console.log("2" + this.state.changeRepComm.toString())
if (prevState.changeRepComm !== this.state.changeRepComm ) {
if (this.updateTimer) return;
this.updateTimer = setTimeout(() => {
//lister response comments
fetch('/api/ReponseCommentaire/listerReponseCommentaire', {
method: "GET",
headers: {
'Accept': 'application/json, application/xml, text/plain, text/html, *.*',
'Content-Type': 'application/json'
}
})
.then(response => response.json())
.then(response => {
console.log('Ajouter response:' + JSON.stringify(response))
this.setState({ ...this.state, reponseCommentaires: response });
})
.catch((err) => {
console.log('fetch failed => ', err);
})
}, 1000);
} }
If your looking to update every second, you can initialize a timer when component mounts.
componentDidMount(prevProps, prevState) {
if (this.updateTimer) { return; }
this.updateTimer = setInterval(() => {
fetch('/api/ReponseCommentaire/listerReponseCommentaire', {
method: "GET",
headers: {
'Accept': 'application/json, application/xml, text/plain, text/html, *.*',
'Content-Type': 'application/json'
}
})
.then(response => response.json())
.then(response => {
this.setState({
...this.state,
reponseCommentaires: response,
});
})
.catch((err) => console.log('fetch failed => ', err) )
}, 1000);
}