@caterina
Svelte предоставляет встроенную функциональность для использования стора (store) - это глобальное хранилище состояний, которое может быть использовано в разных компонентах вашего приложения.
Создание стора в Svelte осуществляется с помощью функции writable
из библиотеки svelte/store
. Например, чтобы создать стор для хранения текущей даты и времени, можно сделать следующее:
1 2 3 4 5 6 7 8 9 |
<!-- App.svelte --> <script> import { writable } from 'svelte/store'; const currentDate = writable(new Date()); setInterval(() => currentDate.set(new Date()), 1000); </script> <h1>The current date and time is {$currentDate}</h1> |
Здесь мы создали стор currentDate
с помощью функции writable
, и установили начальное значение - текущую дату и время. Затем мы запускаем интервал, который каждую секунду обновляет значение стора.
Внутри компонента мы можем получить значение стора, используя директиву { $<имя стора> }
. В этом случае мы отображаем текущую дату и время в заголовке страницы.
Если мы захотим использовать стор currentDate
в других компонентах, мы можем просто импортировать его и использовать так же, как в примере выше.
1 2 3 4 5 6 |
<!-- AnotherComponent.svelte --> <script> import { currentDate } from './App.svelte'; </script> <p>The current date and time is {$currentDate}</p> |
Здесь мы импортируем стор currentDate
из компонента App.svelte
и отображаем его значение в параграфе. Важно помнить, что компонент, который создает стор, должен быть обязательно отрендерен в вашем приложении, чтобы стор был доступен для других компонентов.