0.0.22 • Published 9 years ago

flacks v0.0.22

Weekly downloads
-
License
MIT
Repository
-
Last release
9 years ago

Flacks

Example

/*
 * Actions
 */
import {Action} from 'flacks';

const updateFoo = Action.create((dispatch) =>
  (nextFoo) => dispatch(nextFoo)
);

const destroyFoo = Action.notifier();


/*
 * Stores
 */
import {Store} from 'flacks';

function mapStateWhenFooWillUpdate(state, nextFooValue) {
  return Object.assign({}, state, {foo: nextFooValue});
}

function mapStateWhenFooWillDestroy(state) {
  return Object.assign({}, state, {foo: null});
}

const fooStore = Store.partial({foo: 'Initial foo value'})
  .subscribe(updateFoo, mapStateWhenFooWillUpdate)
  .subscribe(destroyFoo, mapStateWhenFooWillDestroy);

const store = Store.create(fooStore);


/*
 * Components
 */
import {connect} from 'flacks';

@connect(store)  // same as @connect(store, (storeState) => storeState)
class Component extends React.Component {
  state = {foo: this.props.foo};
  componentWillReceiveProps(nextProps) {
    if (this.state.foo !== nextProps.foo) {
      this.setState({foo: nextProps.foo});
    }
  }
  render() {
    return (
      <div>
        <h1>{this.props.foo}</h1>
        <form onSubmit={this.handleSubmit.bind(this)}>
          UPDATE FOO: <input value={this.state.foo} onChange={this.handleFooChange.bind(this)}>
        </form>
        <button onClick={this.handleDestroyFooClick.bind(this)}>DESTROY FOO</button>
      </div>
    );
  }
  handleSubmit(e) {
    e.preventDefault();
    updateFoo.invoke(this.state.foo);
  }
  handleFooChange(e) {
    this.setState({foo: e.target.value});
  }
  handleDestroyFooClick() {
    destroyFoo.invoke();
  }
}
0.0.22

9 years ago

0.0.21

9 years ago

0.0.20

10 years ago

0.0.19

10 years ago

0.0.18

10 years ago

0.0.17

10 years ago

0.0.16

10 years ago

0.0.15

10 years ago

0.0.14

10 years ago

0.0.13

10 years ago

0.0.12

10 years ago

0.0.11

10 years ago

0.0.10

10 years ago

0.0.9

10 years ago

0.0.8

10 years ago

0.0.7

10 years ago

0.0.6

10 years ago

0.0.5

10 years ago

0.0.4

10 years ago

0.0.3

10 years ago

0.0.2

10 years ago

0.0.1

10 years ago

0.0.0

10 years ago