mobx-observer-hook

Usage

import * as React from 'react'; 
import * as ReactDOM from 'react-dom';
import { observable, action } from 'mobx'; 
import { useObserver } from 'mobx-observer-hook'; 
 
class Model {
  @observable name = 'test'; 
  @observable time:Date = new Date();
 
  @action.bound
  setTime(time:Date) {
    this.time = time;
  }
}
 
function MyComponent({model}) {
  return useObserver(()=><div 
    className="my-component">{model.name} - {model.time.toString()}</div>,[model]);
}
 
let el = document.getElementById('app');
 
if (!el){
  el = document.createElement('div');
  el.id = 'app';
  document.body.appendChild(el);
}
 
const m = new Model();
m.name = 'Suhail'; 
 
ReactDOM.render(
  <MyComponent model={m} />,
  el
);
 
setInterval(()=>{
  m.setTime(new Date());
},1000);