Edit

Event

Event is an intention to change state.

Event Methods

watch(watcher)

Returns

(Subscription): Unsubscribe function

map(fn)

Сreates a new event, which will be called after the original event is called, applying the result of a fn as a payload.

Returns

(Event): New event

filter({fn})

Сreates a new event, which will be called after the original event is called, if fn returns true.

Example

import {createEvent, createStore} from 'effector'

const numbers = createEvent('event with {x: number}')

const positiveNumbers = numbers.filter({
  fn: ({x}) => x > 0,
})

const lastPositive = createStore(0)
    .on(positiveNumbers, (n, {x}) => x)

try it

Returns

(Event): New event

filterMap(fn)

Сreates a new event, which will be called after the original event is called, if fn returns not undefined.

Example

import React from 'react'

import {createEvent, createStore} from 'effector'

const openModal = createEvent('open that modal')

const openModalUnboxed = openModal.filterMap(ref => {
  if (ref.current) return ref.current
})

openModalUnboxed.watch(modal => modal.showModal())

const closeModal = createEvent('close that modal')

closeModal
  .filter(ref => {
    if (ref.current) return ref.current
  })
  .watch(modal => modal.close())

const modalRef = React.createRef()

const App = () => (
  <>
    <dialog ref={modalRef}>
      <form method='dialog'>
        <fieldset>
          <legend>Modal</legend>
          Tap to close
          <button type='submit' onSubmit={() => closeModal(modalRef)}>
            ❌
          </button>
        </fieldset>
      </form>
    </dialog>

    <button onClick={() => openModal(modalRef)}>Open modal</button>
  </>
)

try it

Returns

(Event): New event

prepend(fn)

Returns

(Event): New event

← createEventcreateEffect →