Роутинг

Связи

Введение

В apx отсутствует "настоящий" роутинг. Вместо этого используется понятие "фреймы".

Однако имеется возможность зарегистрировать некоторые фреймы с короткими именам, типа " path", и при показе фрейма использовать этот короткий путь вместо конкретного компонента-фрейма.

Пример регистрации:

import {apx} from './vendor'
import Home from './frames/Home'
import Frame1 from './frames/Frame1'

let routes = [
    // пустой путь - страница по умолчанию
    {path: '', frame: Home},

    // path должен начинатся с '/'
    {path: '/frame1', frame: Frame1},

    // можно (даже желательно) регистрировать динамический импорт фрейма
    {path: '/frame1-1', frame: import('./frames/Frame1')},
]

apx.app.run(() => {
    // инициализируем router, обязательно внутри app.apx.run - обработчика
    apx.app.frameRouter.addRoutes(routes)
    // ...
})

Зарегистрированный фрейм можно показать так:

apx.showFrame({
    frame: '/frame1', props: {prop1: 1}
})

hash страницы

Когда показывается фрейм через router, в hash адреса страницы меняется, в соотвествии с параметрами показа фрейма.

Например, покажем фрейм:

apx.showFrame({
    frame: '/frame1', props: {prop1: 1}
})

Тогда адрес страницы станет такой:

http://localhost:8080/jc#/frame1?prop1=1

Если показывается фрейм не через router, а через конкретный компонент, то hash удаляется.

Например, покажем фрейм:

apx.showFrame({
    frame: import('./frames/Frame1'), props: {prop1: 1}
})

Тогда адрес страницы станет такой:

http://localhost:8080/jc

Если явно указать в адресной странице параметры фрейма, зарегистрированного в router, то при загрузке приложения будет открыт указанный фрейм.

Допустим введем в адресную строку следующее:

http://localhost:8080/jc#/frame1?prop1=1

Тогда при загрузке страницы будет показан фрейм /frame1 со свойством prop1=1, что эквивалентно запуску такого кода:

apx.showFrame({
    frame: '/frame1', props: {prop1: 1}
})

Таким образом hash страницы не что иное, как просто закладка на определенные фреймы.