-
Notifications
You must be signed in to change notification settings - Fork 1
Хуки
Для навигации по View нужно воспользоваться хуком useRouterView
:
import { useRouterView } from "@kokateam/router-vkminiapps";
const [view, toView] = useRouterView();
В качестве параметров хук возвращает активную view и функцию для навигации по View.
Параметр | Тип | Описание |
---|---|---|
view | string |
Текущая активная View |
toView |
string or number
|
Если будет передан string , то произойдет навигация на эту view. Если number (-1, -2 и etc), то навигация назад конкретно по истории всех View's |
Для навигации по Panel нужно воспользоваться хуком useRouterPanel
:
import { useRouterPanel } from "@kokateam/router-vkminiapps";
const [panel, toPanel] = useRouterPanel();
В качестве параметров хук возвращает объект и функцию для навигации по View.
Параметр | Тип | Описание |
---|---|---|
panel | { active: string; panels: string[] } |
active - текущая активная Panel. panels - массив из id панелей в порядке открытия |
toPanel |
string or number
|
Логика как в useRouterView
|
Для навигации назад нужно воспользоваться хуком useRouterBack
:
import { useRouterBack } from "@kokateam/router-vkminiapps";
const toBack = useRouterBack();
В данном случае допустимо любое название для функции этого хука. То есть: toBack
, toRouterBack
или superMegaBack
Параметр | Тип | Описание |
---|---|---|
toBack | number |
Навигация назад по всему приложению, принимает только отрицательные числа, как кол-во шагов назад |
Для навигации по попаутам нужно воспользоваться хуком useRouterPopout
:
import { useRouterPopout } from "@kokateam/router-vkminiapps";
const [popout, toPopout] = useRouterPopout();
В качестве параметров хук возвращает текущий popout и функцию для отображения попаута.
Параметр | Тип | Описание |
---|---|---|
popout | any |
Текущий активный popout , нужно передать в SplitLayout как параметр popout
|
toPopout | any |
Принимает любой тип данных, для закрытие попаута можно воспользоваться этим же методом: toPopout() или toPopout(null)
|
Для навигации по модалкам нужно воспользоваться хуком useRouterModal
:
import { useRouterModal } from "@kokateam/router-vkminiapps";
const [activeModal, toModal] = useRouterModal();
В качестве параметров хук возвращает id активной модалки и функцию для отображения модального окна.
Параметр | Тип | Описание |
---|---|---|
activeModal |
null or string
|
ID активного модального окна, если его нет, то возвращается null
|
toModal |
number or string
|
Для отображения модального окна, нужно передать его id , если передать number , то будет выполнена навигация назад
|
Для изменения или получения настроек нужно воспользоваться хуком useRouterModal
:
import { useRouterSettings } from "@kokateam/router-vkminiapps";
const [settings, setSettings] = useRouterSettings();
Параметр | Тип | Начальное состояние | Описание |
---|---|---|---|
isSwipeBack | boolean | true | Состояние вкл\выкл SwipeBack в приложении |
isInternal | boolean | false | Является ли приложение internal. При включении поддерживаем соответствующие функциональности для internal, например, отправляем в нужный момент события VKWebAppEnableSwipeBack и VKWebAppDisableSwipeBack
|
boolean | true | Состояние вкл\выкл хеша в приложении. При включении, в URL отображаем хеш и поддерживаем навигацию напрямую по хешу | |
isBack | boolean | true | Состояние вкл\выкл навигации назад. Может пригодиться в заглушках, откуда нельзя выполнять навигацию назад (отсутствие интернета, бан в приложении и тд) |
string | "" | Дефолтная View. Можно переопределить до иницилизации приложения | |
string | "" | Дефолтная Panel. Можно переопределить до иницилизации приложения |
Сейчас работают только такие настройки:
- isSwipeBack
- isInternal
- isBack
Хук useRouterSettings()
возвращает массив, где второй параметр как раз работает как функция изменения настроек. Указывать все настройки для хука не нужно, пример использования:
import { useRouterSettings } from "@kokateam/router-vkminiapps";
const [, setSettings] = useRouterSettings();
setSettings({ isSwipeBack: false }) // поменялось только isSwipeBack на false
setSettings({ isInternal: true, isBack: false }) // поменялись только isInternal и isBack. Состояние isSwipeBack=false сохранилось