redux-svelte-store Svelte Themes

Redux Svelte Store

redux-svelte-store

Simple wrapper to convert a redux store to a synthetic svelte readable store that conforms to the svelte store contract.

Install

npm install redux-svelte-store

Usage

Basic usage

<script>
  import toReadable from 'redux-svelte-store'
  const svelteStore = toReaable(reduxStore)

  svelteStore.subscribe(state => { /* ... */ })
</script>

<!-- now you can use $ prefix-->
<h1>{$svelteStore.prop}</h1>

Use selector

Pass a selector function as second argument.

const foobarStore = toReaable(reduxStore, (state) => {
  return state.foobar
})

// listener will only be notified when `state.foobar` changed
foobarStore.subscribe(foobar => { /* ... */ })

Also support string key paths as arguments.

/**
 * Example the app state is of shape:
 * {
 *   foo: {
 *     bar: "zoo"
 *   }
 * }
 */

const zooStore = toReaable(reduxStore, "foo", "bar")
console.log($zooStore) // "zoo"

Top categories

Loading Svelte Themes