effector-vue
effector-vue
Vue bindings for effector
Installation
npm install --save effector effector-vue
Or using yarn
yarn add effector effector-vue
Usage
import {createStore, createEvent} from 'effector'
export const inputText = createEvent()
export const $text = createStore('').on(inputText, (_, text) => text)
export const $size = $text.map(text => text.length)
<script lang="ts" setup>
import {useUnit} from 'effector-vue/composition'
import {$text, $size, inputText} from './model'
const text = useUnit($text)
const size = useUnit($size)
const handleTextChange = useUnit(inputText)
</script>
<template>
<form>
<input
type="text"
@input="(e) => handleTextChange(e.currentTarget.value)"
:value="text"
/>
<p>Length: {{ size }}</p>
</form>
</template>
useUnit in docs Units in docs createStore in docs createEvent in docs
Related Packages
@nanostores/vue
Vue integration for Nano Stores, a tiny state manager with many atomic tree-shak...
930,917
74
nanostores
A tiny (351 bytes) state manager for React/Preact/Vue/Svelte with many atomic tr...
202,069,944
7,630
Version History
| Version | Released | License |
|---|---|---|
| 23.2.0 | MIT | |
| 23.1.1 | MIT | |
| 23.1.0 | MIT | |
| 23.0.0 | MIT | |
| 22.2.0 | MIT | |
| 22.1.2 | MIT | |
| 22.1.1 | MIT | |
| 22.1.0 | MIT | |
| 22.0.2 | MIT | |
| 22.0.1 | MIT | |
| 22.0.0 | MIT | |
| 21.1.1 | MIT | |
| 21.1.0 | MIT | |
| 21.0.3 | MIT | |
| 21.0.2 | MIT | |
| 21.0.1 | MIT | |
| 21.0.0 | MIT | |
| 20.5.1 | MIT | |
| 20.5.0 | MIT | |
| 20.4.2 | MIT | |
| 20.4.1 | MIT | |
| 20.4.0 | MIT | |
| 20.3.3 | MIT | |
| 20.3.2 | MIT | |
| 20.3.1 | MIT | |
| 20.3.0 | MIT | |
| 20.2.1 | MIT | |
| 20.2.0 | MIT | |
| 20.1.2 | MIT | |
| 20.1.1 | MIT |
Showing the latest 30 of 40. See every release on npm
Pre-releases (7)
| Version | Released | License |
|---|---|---|
| 23.0.0-rc.6 | MIT | |
| 23.0.0-rc.5 | MIT | |
| 23.0.0-rc.4 | MIT | |
| 0.18.3-beta.1 | MIT | |
| 0.18.0-rc.3 | MIT | |
| 0.18.0-rc.2 | MIT | |
| 0.18.0-rc.1 | MIT |