Store
import: @azure-net/kit/edges
Сторы как и презентеры являются частью edges-svelte и в ssr проекте вы обязаны настроить edges-svelte с помощью edgesHandle (смотри раздел Настройка проекта, либо документацию по edges-svelte). Все что находится в createStore также ssr-friendly так как он полностью повторяет логику createPresenter и отличается лишь тем что предоставляет доступ к работе с состояниями.
createStore
Создает базовый стор, предоставляя вам доступ к createState, createDerivedState, createRawState, о них ниже.
createStoreFactory
Является фабрикой для создания сторов. Повторяет суть createPresenterFactory, а значит нужен для создания сторов с вашими зависимостями.
Примитивы состояний
- createState является прямым аналогом svelte writable, но полностью ssr-safe.
- createDerivedState является прямым аналогом derived (не $dervied, а именно derived)
- createRawState под капотом является $state. Это легковесная реактивная переменная не требующая подписки, но с доступом через
.value
Примеры
typescript
import { createStore } from '@azure-net/kit/edges';
// Первым аргументом мы также обязаны передать уникальное имя
const MyStore = createStore('MyStore', ({ createState, createDerivedState, createRawState }) => {
// Аналог writable
const collection = createState<number[]>([]);
// Аналог derived
const collectionLengthDoubled = createDerivedState([collection], ([$c]) => $c.length * 2);
// Анлог $state
const justSomeState = createRawState<number>(0);
const updateAction = (num: number) => {
collection.update((n) => [...n, num]);
justSomeState.value = num;
};
return { collection, collectionLengthDoubled, justSomeState, updateAction };
});html
<script lang="ts">
import { MyStore } from '${ContextName}/delivery/{FeatureName}';
const { collection, collectionLengthDoubled, updateAction } = MyStore();
</script>
{$collection.join(', ')}
{$collectionLengthDoubled} <!-- 0 до клика по кнопке ниже, 2 после -->
<button onclick={() => updateAction(25)}>count update</button> <!-- Клик обновит состояние, добавив новый элемент в массив и изменив justSomeState -->