Permalink
Browse files

updates

  • Loading branch information...
jamiebuilds committed May 17, 2018
1 parent 01100bf commit 5d06ea3e3e4921aeb72e6f1617f7f973e169a30f
Showing with 24 additions and 11 deletions.
  1. +23 −6 README.md
  2. +1 −1 __tests__/unstated.tsx
  3. +0 −4 yarn.lock
View
@@ -258,6 +258,23 @@ class CounterContainer extends Container {
}
```
However, unlike React's `setState()` Unstated's `setState()` returns a promise,
so you can `await` it like this:
```js
class CounterContainer extends Container {
state = { count: 0 };
increment = async () => {
await this.setState({ count: 1 });
console.log(this.state.count); // 1
};
}
```
Async functions are now available in [all the major browsers](https://caniuse.com/#feat=async-functions),
but you can also use [Babel](http://babeljs.io) to compile them down to
something that works in every browser.
##### `<Subscribe>`
Next we'll need a piece to introduce our state back into the tree so that:
@@ -324,14 +341,14 @@ Well because our containers are very simple classes, we can construct them in
tests and assert different things about them very easily.
```js
test('counter', () => {
test('counter', async () => {
let counter = new CounterContainer();
assert(counter.state.count === 0);
counter.increment();
await counter.increment();
assert(counter.state.count === 1);
counter.decrement();
await counter.decrement();
assert(counter.state.count === 0);
});
```
@@ -348,10 +365,10 @@ test('counter', () => {
</Provider>
);
click(tree, '#increment');
await click(tree, '#increment');
assert(counter.state.count === 1);
click(tree, '#decrement');
await click(tree, '#decrement');
assert(counter.state.count === 0);
});
```
@@ -371,7 +388,7 @@ test('counter', () => {
</Provider>
);
click(tree, '#increment');
await click(tree, '#increment');
assert(inc.calls.length === 1);
assert(dec.calls.length === 0);
});
View
@@ -13,7 +13,7 @@ class CounterContainer extends Container<{ count: number }> {
class AmounterContainer extends Container<{ amount: number }> {
state = { amount: 1 };
setAmount(amount) {
setAmount(amount: number) {
this.setState({ amount });
}
}
View

Some generated files are not rendered by default. Learn more.

Oops, something went wrong.

0 comments on commit 5d06ea3

Please sign in to comment.