#svelte
Вопрос:
Я попытался инициализировать массив, который я хотел бы получить из разных модулей.
export const columns = readable(['id', 'postId', 'name', 'email', 'body']);
Я могу успешно просматривать этот магазин в разделах html, подобных этому.
{#each $columns as col}
Однако я не могу перебирать значения в разделах скрипта. Как получить доступ к значениям? Был ли это неправильный способ инициализации общего массива? Есть ли лучший способ настроить общий массив, доступный из любого места и не изменяющийся?
Ответ №1:
В разделе «Сценарий» компонента «Стройный» вы можете просто использовать $columns.forEach(...)
для перебора массива.
Тем не менее, если этот массив никогда не изменяется и фиксируется в самом коде (например, вы уже заранее знаете значения), вам не нужны (минимальные) накладные расходы магазина, но вы можете просто сделать
export const columns = ['id', 'postId', 'name', 'email', 'body']; Object.freeze(columns);
Это freeze
предотвращает постоянное изменение массива.
Ответ №2:
Существует два способа доступа к значению (и впоследствии их дочерним элементам) из svelte
хранилища в зависимости от контекста, в котором выполняется ваш сценарий:
- В
.svelte
файле - Вне
.svelte
файла (например, a.js
или.ts
файл)
Примечание: Как указал Стефан Ванраес в своем ответе, его рекомендуется использовать
Object.freeze
, если вы больше нигде не изменяете содержимое своего массива, так как его размещение в вашемreadable
только предотвратит изменение ссылки, а не ее содержимого.
1. В .svelte
файле
Здесь вы можете добавить $
в начало переменных хранилища, чтобы получить доступ к их значениям (и впоследствии к их дочерним).:
lt;scriptgt; import { readable } from 'svelte/store'; const columns = readable( Object.freeze( ['id', 'postId', 'name', 'email', 'body'], ), ); console.log($columns); // ['id', 'postId', 'name', 'email', 'body'] console.log($columns[0]); // 'id' lt;/scriptgt;
2. Вне .svelte
файла
Здесь вы можете использовать экспортированный get
метод из svelte/store
:
import { get, readable } from 'svelte/store'; const columns = readable( Object.freeze( ['id', 'postId', 'name', 'email', 'body'], ), ); console.log(get(columns)); // ['id', 'postId', 'name', 'email', 'body'] console.log(get(columns[0])); // 'id'