Skip to content

Instantly share code, notes, and snippets.

@mcoquet
Created June 29, 2017 00:42
Show Gist options
  • Save mcoquet/defba70945a6e1b724f8711a77bdcaf9 to your computer and use it in GitHub Desktop.
Save mcoquet/defba70945a6e1b724f8711a77bdcaf9 to your computer and use it in GitHub Desktop.
jumpsuit getting started index.js suggestion with corrected syntax errors
// Import Jumpsuit
import React from 'react'
import { Render, State, Actions, Effect, Component } from 'jumpsuit'
// Create a state with some actions
const CounterState = State({
// Initial State
initial: { count: 0 },
// Actions
increment ({ count }) {
return { count: count + 1 }
},
decrement ({ count }) {
return { count: count - 1 }
},
})
// Create an async action
Effect('incrementAsync', () => {
setTimeout(() => {
Actions.increment()
}, 1000)
})
// Create a subscribed component
const Counter = Component({
render() {
return (
<div>
<h1>{ this.props.count }</h1>
<button onClick={ () => Actions.increment() }>Increment</button>
<button onClick={ () => Actions.decrement() }>Decrement</button>
<br />
<button onClick={ () => Actions.incrementAsync() }>Increment Async</button>
</div>
)
}
}, (state) => ({
// Subscribe to the counter state (will be available via this.props.counter)
count: state.counter.count
}))
// Compose the global state
const globalState = { counter: CounterState }
// Render your app!
Render(globalState, <Counter/>)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment