Skip to content

Computed

ts
import { computed, Computed } from "@dpg.gg/core/store";

Overview

Computed представляет собой readonly обертку над atom.

Он предназначен для своевременного реагирования и выполнение каких-либо действий на значениями атомов.

ts
const num = atom(2);
const pow = computed(num, (n) => Math.pow(n)); 
const value = pow.get(); //  4
ts
const data = atom(["item 1", "item 2", "item 3"]);
const order = atom("asc");
const sorted = computed([data, order], ([d, o], set) => set(customSort(d, o))); 

По аналонии с atom, можно создавать Computed двумя способами computed() и new Computed().

Arguments

stores required

  • Type: Atom | Atom[]

Принимает один или несколько atom, которые будут являться зависимостями для обновления и выполнения cb

ts
atom(8);
new Atom("text");

cb required

  • Arg: values: T | T[] - актуальные значения атомов переданных в stores
  • Arg: set optional - обязательно при наличии 2 и более зависимостей

Callback функция для выполнения действий над полученными значениями из переданных atom. При наличии 2 и более зависимостей необходимо устанавливать новое значение через callback set, вместо return value

ts
const pow = computed(num, (n) => Math.pow(n));
const sorted = computed([data, order], ([d, o], set) => set(customSort(d, o)));

Methods

get()

Возвращает актуальное значение computed.

ts
const store = atom(2);
const pow = computed(store, (n) => Math.pow(n));
const value = pow.get(); // 4

once, on, off, emit

Это методы прослушивателя события, подробнее можно посмотреть на соответствующей странице EventEmitter

Events

change

  • Arg cb: (value)

Событие вызывается каждый раз, когда один из atom, пераданных при создании computed, измениля.

Это событие необходимо для подписки на изменения.

ts
const num = atom(2);
const pow = computed(num, (n) => Math.pow(n)); // 
pow.on("change", console.log); // return 9 after set
num.set(3);