mobx-box

0.0.8 • Public • Published

mobx-box

npm version

Discussion here.

tl;dr

const store = new class {
-  @observable foo = '';
-  @observable bar = '';
- 
-  @action setFoo = value => (this.foo = value);
-  @action setBar = value => (this.bar = value);
+  @box foo = '';
+  @box bar = '';
}();
 
console.log(store.foo); // ''
console.log(store.bar); // ''
 
- store.setFoo('Lorem');
- store.setBar('Ipsum');
+ // these are mobx actions (internally), not direct mutations, they don't violate strict mode
+ store.foo = 'Lorem';
+ store.bar = 'Ipsum';
 
console.log(store.foo); // 'Lorem'
console.log(store.bar); // 'Ipsum'

Install

yarn add mobx mobx-box

Example

Edit o43pjz1p6z

import React from 'react';
 
import { configure } from 'mobx';
import { observer } from 'mobx-react';
 
import box from 'mobx-box';
 
configure({ enforceActions: true });
 
const store = new class {
  @box foo = 0;
 
  // or without decorators
  constructor() {
    box(this, 'bar', 0);
  }
}();
 
const Example = () => (
  <div>
    <button onClick={() => (store.foo = Date.now())}>{store.foo}</button>
    <button onClick={() => (store.bar = Date.now())}>{store.bar}</button>
  </div>
);
 
export default observer(Example);

Readme

Keywords

none

Package Sidebar

Install

npm i mobx-box

Weekly Downloads

2

Version

0.0.8

License

MIT

Unpacked Size

4.65 kB

Total Files

4

Last publish

Collaborators

  • sonaye