一段时间不活动后，React Redux更新（重新渲染）组件

Question

How would you go about re-rendering a component (or multiple components) in a React Redux (Express / Mongo backend) app?

I built an app where multiple (authenticated) users collaborate on a Todo list like dashboard in real-time (with chat-like Notes in place of Todo's), but wanted to force a re render after a period of inactivity (possibly with a setInterval in componentDidMount?) so if one user deletes a task, it will eventually refresh on all other users dashboards after a period of time. I was thinking about combining forceUpdate with setInterval but keep reading everywhere that it should be avoided.

I am aware the real-time updates must be done with websockets, but I was wondering if aa simpler short-term solution could be used for this particular situation without resorting to websockets, since my app doesn't really need instantaneous updates.

Here is the main component (list of Notes):

class NoteList extends Component {
  componentDidMount() {
    this.props.getNotes();
  }
}

Answer 1

You are right that the coolest way is use websocket to listen to change event. But for short-term, polling is not a bad idea. Just remember to clear the interval when your component is unmounted.

 componentDidMount() {
    this.props.getNotes();
    this.interval = setInterval(() => this.props.getNotes(), 60000);
 }

 componentWillUnmount() {
    clearInterval(this.interval);
 }