mobx-deku

1.1.2 • Public • Published

mobx-deku

Package with deku component wrapper for combining deku with mobx. Exports the observer function decorator. For documentation, see the mobx project.

npm install mobx-deku

Boilerplate Projects that use mobx-deku

API documentation

observer(component)

Function that converts a Deku component definition or stand-alone render function into a reactive component. See the mobx documentation for more details.

import {observer} from "mobx-deku";
 
const TodoView = observer({
    render({props}) {
        return <div>{props.todo.title}</div>
    }
}));
 

Full Example

import {render, tree} from 'deku';
import element from 'magic-virtual-element';
import {observable} from 'mobx';
import {observer} from 'mobx-deku';
 
class AppState {
  @observable counter = 0;
  increaseCounter () {
    this.counter += 1;
  }
}
const appState = new AppState();
 
const App = observer({
  render ({props}) {
    return (
      <div>
        <div class='app'>{props.appState.counter}</div>
        <button onClick={onClick}>+</button>
      </div>
    );
    function onClick () {
      props.appState.increaseCounter();
    }
  }
});
 
render(tree(<App appState={appState} />), document.createElement('div'));

Special thanks to mobx-react and @mattmccray's gist

Readme

Keywords

Package Sidebar

Install

npm i mobx-deku

Weekly Downloads

2

Version

1.1.2

License

ISC

Last publish

Collaborators

  • orrybaram