effector-react

Effector-react

React bindings for effector

Installation

npm install --save effector effector-react

Or using yarn

yarn add effector effector-react

Usage

import {createStore, createStoreObject, createEvent} from 'effector'

import {createStoreConsumer} from 'effector-react'

const inputText = createEvent('input text')
const text = createStore('').on(inputText, (state, payload) => payload)

const length = createStore(0).on(inputText, (state, payload) => payload.length)

const store = createStoreObject({
 text,
 length,
})

const FormStore = createStoreConsumer(store)

const Form = () => (
 <FormStore>
  {state => (
   <form>
    <input
     type="text"
     onChange={e => inputText(e.currentTarget.value)}
     value={state.text}
    />
    <p>Length: {state.length}</p>
   </form>
  )}
 </FormStore>
)

Changelog

effector, effector-react, effector-vue 19.0.0

To indicate the stability of the project, we adopting semantic versioning and happy to announce version 19.0.0 for all packages. And to make the transition easier, that release contains no breaking changes; simple replacement of "^0.18.*" to "^19.0.0" is safe for sure ☄️