developit/unistore

incrementAsync action in the example does not work.

tteke opened this issue · 3 comments

tteke commented
import "./style";
import { Component, render } from "preact";
import { Provider, createStore, connect } from "unistore";

let store = createStore({ count: 0 });

// If actions is a function, it gets passed the store:
let actions = store => ({
  // Actions can just return a state update:
  increment(state) {
    return { count: state.count + 1 };
  },

  // The above example as an Arrow Function:
  increment2: ({ count }) => ({ count: count + 1 }),

  // Async actions are actions that call store.setState():
  incrementAsync(state) {
    setTimeout(() => {
      store.setState({ count: state.count + 1 });
    }, 100);
  }
});

const App = connect("count", actions)(({ count, incrementAsync }) => (
  <div>
    <p>Count: {count}</p>
    <button onClick={incrementAsync}>Increment</button>
  </div>
));

render(
  <Provider store={store}>
    <App />
  </Provider>,
  document.body
);

I tried the use it in the example given like above, just changed the increment to incrementAsync but it doesnt update the state.

tteke commented

I guess the problem is with the dependency versions. In the example unistore dependency version is 2.2.0 and in the one you sent its 3.1.0. So maybe version in the sandbox should also be bumped.

import createStore from 'unistore'
import { Provider, connect } from 'unistore/preact'

createStore needs to come from unistore and Provider/connect come from its specific implementation (preact or react)