Bu sahifa hali tarjima qilinmagan

Tarjima qoshish uchun havola boyicha o'tib Pull Request oching (havolaga o'tish).

Standart til uchun tarkibni ko'rsatadi.

import { type Store, type StoreWritable } from "effector";

Store is an object that holds the state value. Store gets updates when it receives a value that is not equal (!==) to the current one and to undefined. Store is a Unit. Some stores can be derived.

Methods

.map(fn)

Creates a derived store. It will call a provided function with the state when the original store updates, and will use the result to update the derived store.

Formulae

const $second = $first.map(fn);

Arguments

  1. fn (Function): Function that receives state and returns a new state for the derived store.
  2. config (Object): Optional configuration.

Returns

DerivedStore: New derived store.

Examples

Basic

import { createEvent, createStore } from "effector";

const changed = createEvent();
const $title = createStore("").on(changed, (_, newTitle) => newTitle);
const $length = $title.map((title) => title.length);

$length.watch((length) => {
  console.log("new length", length);
});

changed("hello");
changed("world");
changed("hello world");

Try it

SkipVoid

const $length = $title.map((title) => title.length, { skipVoid: false });

.on(trigger, reducer)

Updates state when trigger is triggered by using a reducer.

Formulae

$store.on(trigger, reducer);

Arguments

  1. trigger: Event, Effect, or another Store.
  2. reducer: Reducer: Function that receives state and params and returns a new state.

Returns

Store: Current store.

Examples

Basic

import { createEvent, createStore } from "effector";

const $store = createStore(0);
const changed = createEvent();

$store.on(changed, (value, incrementor) => value + incrementor);

$store.watch((value) => {
  console.log("updated", value);
});

changed(2);
changed(2);

Try it

.watch(watcher)

Calls watcher function each time when the store is updated.

Formulae

const unwatch = $store.watch(watcher);

Arguments

  1. watcher: Watcher: Watcher function that receives the current store state as the first argument.

Returns

Subscription: Unsubscribe function.

Examples

Basic

const add = createEvent();
const $store = createStore(0).on(add, (state, payload) => state + payload);

$store.watch((value) => console.log(`current value: ${value}`));
add(4);
add(3);

.reset(...triggers)

Resets store state to the default value.

Formulae

$store.reset(...triggers);

Arguments

  1. triggers: ((Event | Effect | Store)[]): any number of Events, Effects, or Stores.

Returns

Store: Current store.

Examples

Basic

import { createEvent, createStore } from "effector";

const increment = createEvent();
const reset = createEvent();

const $store = createStore(0)
  .on(increment, (state) => state + 1)
  .reset(reset);

$store.watch((state) => console.log("changed", state));

increment();
increment();
reset();

Try it

.off(trigger)

Removes reducer for the given trigger.

Formulae

$store.off(trigger);

Arguments

  1. trigger: Event, Effect, or Store.

Returns

Store: Current store.

Examples

Basic

import { createEvent, createStore, merge } from "effector";

const changedA = createEvent();
const changedB = createEvent();

const $store = createStore(0);
const changed = merge([changedA, changedB]);

$store.on(changed, (state, params) => state + params);
$store.off(changed);

Try it

Properties

.updates

Returns

Event: Event that represents updates of the given store.

Example

import { createStore, is } from "effector";

const $clicksAmount = createStore(0);
is.event($clicksAmount.updates);

$clicksAmount.updates.watch((amount) => {
  console.log(amount);
});

Try it

.reinit

Returns

Event: Event that can reinitialize a store with a default value.

Example

import { createStore, createEvent, sample, is } from "effector";

const $counter = createStore(0);
is.event($counter.reinit);

const increment = createEvent();

$counter.reinit();
console.log($counter.getState());

Try it

.shortName

Returns

(string): ID or short name of the store.

.defaultState

Returns

(State): Default state of the store.

Example

const $store = createStore("DEFAULT");
console.log($store.defaultState === "DEFAULT");

Utility methods

.getState()

Returns the current state of the store.

Returns

(State): Current state of the store.

Example

import { createEvent, createStore } from "effector";

const add = createEvent();

const $number = createStore(0).on(add, (state, data) => state + data);

add(2);
add(3);

console.log($number.getState());

Try it

Readonly store

TBD

Types

import { type StoreValue } from "effector";

StoreValue<S>

Extracts type of Store or StoreWritable value.

const $store: Store<Value>;
type Value = StoreValue<typeof $store>;
Tarjima jamiyat tomonidan qollanilyapti

Ingliz tilidagi hujjatlar eng dolzarb hisoblanadi, chunki u effector guruhi tomonidan yozilgan va yangilanadi. Hujjatlarni boshqa tillarga tarjima qilish jamiyat tomonidan kuch va istaklar mavjud bo'lganda amalga oshiriladi.

Esda tutingki, tarjima qilingan maqolalar yangilanmasligi mumkin, shuning uchun eng aniq va dolzarb ma'lumot uchun hujjatlarning asl inglizcha versiyasidan foydalanishni tavsiya etamiz.

Hammualliflar