unistore icon indicating copy to clipboard operation
unistore copied to clipboard

incrementAsync action in the example does not work.

Open tteke opened this issue 6 years ago • 3 comments

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 avatar Nov 21 '18 20:11 tteke

https://codesandbox.io/s/w2p786r788

indatawetrust avatar Nov 23 '18 07:11 indatawetrust

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.

tteke avatar Nov 23 '18 07:11 tteke

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)

kidqueb avatar Jan 06 '19 01:01 kidqueb