State-менеджер реализует принцип "Построителя" ("Builder"): к объекту состояния предлагается применить ряд методов для тех или иных задач (отметим сразу, что использование каждого из них - опционально, за исключением many() / one()):
api (path: string)
Принимает в аргументе относительный путь к получению данных с api. Присваивает результат в value объекта (с учётом template, т.е. структуры возвращаемых backend-ом данных, о котором далее).
template (template: string)
Форматирует приходящие с backend-а данные согласно шаблону, название которого указывается в аргументе. К примеру, из такого ответа:
{
"data": [
{
"id": 0,
"title": "New news article"
},
{
"id": 1,
"title": "New a new news article!"
}
],
"meta": {
"total-count": 5,
"page-count": 1,
"current-page": 1,
"per-page": 20
}
}можно оставить только следующее содержимое:
[
{
"data": [
{
"id": 0,
"title": "New news article"
},
{
"id": 1,
"title": "New a new news article!"
}
],
"meta": {
"total-count": 5,
"page-count": 1,
"current-page": 1,
"per-page": 20
}
}
], убрав лишние оболочки и meta-данные (тем не менее в других функциях state-менеджера meta-данные останутся доступными, об этом позже). Некоторые templat-ы для часто встречаемых структур возвращаемых с backend-а данных предоставлены самим state-менеджером (к примеру, уже продемонстрированный 'yii2-data-provider'), также можно настроить template и самостоятельно функцией setCustomTemplate.
join()
Может выполнять 2 возможные функции, в примере предыдущего раздела продемонстрированы обе: - можно передать в аргументе ссылку на другой объект state-менеджера (причём в том числе и другого хранилища, что и продемонстрировано в примере) - в результате, по изменению значения переданного по ссылке объекта, данные из api будут подгружаться заново. Ссылка на объект передается с помощью метода .ref(), применяемого к классу хранилища (это может быть this, либо импортируемый другой класс), и в аргументе ref-a название объекта в строке. В данном примере, посты заново подгружаются при изменении языка.
public post = state<IPost>({})
.join(this.items, "slug")значение для отдельного поста будет браться из массива постов (1-й аргумент) в случае, если оно будет найдено в массиве по slug-у (2-й аргумент). Лишь в противном случае оно будет загружено с api.
joinToQuery(queryTitle: string, queryValue: any)
Используется для добавления query-параметра к api-запросу. 1-й аргумент - название query-параметра; 2-й аргумент - его значение, которое может быть как статичным, так и браться из значения любого объекта любого из хранилищ (по ссылке). В примере предыдущего раздела в качестве query-параметра добавляется язык: вкупе с методом join() посты на нужном языке реактивно подгружаются при изменениях языка.
auth (token: string)
Позволяет осуществить api-запрос с учётом Bearer-авторизации, по токену, который можно прописать как в виде статичной строки, так и - в виде .ref-ссылки на объект класса (к примеру, можно хранить токен авторизации отдельным объектом).
sort(f: Function)
Аналогично одноименной JS-функции, осуществляет автоматически сортировку получаемых с api данных. В аргументе принимает функцию, осуществляющую логику сортировки.
filter()
Позволяет автоматически фильтровать получаемые с api данные. В аргументах принимает: - ссылку на класс, содержащий логику фильтрации (о его написании: ...якорная ссылка) - значение "emit-always" либо "emit-localy" (в виде строки). При первом из них при каждом изменении параметров фильтра запросы к api будут осуществляться заново. При emit-localy фильтрация будет осуществляться локально, над уже имеющимся массивом.
pagination(size: number, append: boolean)
Добавляет поддержку пагинации: к запросам на бэкэнд будет добавлен query-параметр page[size], равный 1-му указанному в функцию аргументу (size). page[number] изначально равен единице, затем изменяется при использований функций next и prev. Изменить названия query-параметров можно внутри функции createCustomTemplate.
watch (item: string, f: Function)
Также доступна функция watch (item: string, () => {} : Function), применяемая к самому классу (не к создаваемым объектам), позволяющая отслеживать изменения значения определенного объекта, и выполнять по ним определенные действия. Доступен внутри конструктора.
globalWatch (item: string, f: Function)
globalWatch (item: string, () => {} : Function) работает аналогично простому watch-у, но может применяться к другим классам State-менеджера (а не только к this, в отличие от предыдущего), и отслеживать изменения их объектов.
