Create a vue binding - Githubissues

cefn commented 3 years ago

Should prototype and beta a module e.g. @lauf/store-vue to complement the now-stable @lauf/store-react

It can probably be based on Vue's v1 API since there is a strategy that relies on just created and data. If so, this would effectively 'backport' Immer-based @lauf/store reactivity and framework-independent business logic (and in the long run, time-travel DevTools integration) to any version of Vue.

cefn commented 3 years ago

The fundamental approach is to construct a reactive Vue component that's wired to a @lauf store something like this...

import { createStore } from "@lauf/store"
import { vueOptions } from "@lauf/store-vue";

const store = createStore({counter:0})

const vm = new Vue(
  vueOptions(store, {
    counter:(state) => state.counter
  })
);

This would probably be based on a data which populated named properties from the original selectors, and a create that set up a regular Watcher subscription and which arranged callbacks against the named properties whenever their selected value changed.

See https://github.com/vuejs/vue/issues/214#issuecomment-57822806 for inspiration..

cefn commented 3 years ago

There is now a draft working implementation at https://github.com/cefn/lauf-vue-gist/blob/main/src/lib/lauf-store-vue.ts

The edit triggered in the counter interval is successfully propagating to a reactive Vue property for each selector.

This needs to have types mapped properly for the Vue library and some other cleanup before beta.

cefn / lauf

Create a vue binding #161