svelte-reedux
v0.0.4
Published
A slim wrapper allowing the connection of redux in svelte SPAs
Downloads
12
Maintainers
Readme
svelte-reedux
A slim wrapper allowing the connection of redux in svelte SPAs. Inspired heavily by react-redux.
Installation
yarn add svelte-reedux
// or
npm i --save svelte-reedux
Usage
In your App.svelte or top-most level component wrap everything in the Provider component.
App.svelte
<script>
import { store } from './store';
import { Provider } from 'svelte-reedux';
</script>
<Provider store={store}>
// your content
</Provider>
Any child component can now use hooks to access redux:
<script>
import { useStore, useDispatch, useSelector } from 'svelte-reedux';
const store = useStore();
const dispatch = useDispatch();
const username = useSelector((s) => s.username || '');
const updateUsername = (e) => dispatch({
type: 'UPDATE_USERNAME',
value: `${e.target.value}`
});
</script>
<div>
You entered: {$username}
<input value={username} on:input={updateUsername}>
</div>
Form.svelte