Навигация

Напомним, что внутри файла можно объявить методы, связывающие адрес и тип запроса и код, который готовит ответ.

/**
 * Пример: файл catalog.tsx в аккаунте test
 * Экран будет открываться по адресу
 * https://test.chatium.com/catalog
 */
app.screen('/', function(ctx,req) {
    return (
        <screen title="Каталог"/>
    )
})

Действие перехода

Чтобы отправить пользователя на другой экран используется действие navigate

Для отправки пользователя на другой экран используется действие .navigate(). Это действие применимо для любых URL, включая внешние сервисы.

В большинстве случаев, навигация происходит внутри приложения или даже одного файла. Учитывая, что домен приложения может быть изменен, рекомендуется использовать относительные URL-адреса вместо абсолютных для внутренней навигации. Для облегчения относительной навигации Chatium предлагает объект ctx.account. Где ctx — это первый параметр для каждой функции обработки запросов.

ctx.account

Определяет аккаунт, внутри которого работает текущий код. можно получить id или name аккаунта. Для формирования какого-либо урла внутри аккаунта можно использовать метод  ctx.account.url().

ctx.account.url('/page')

Для создания navigate-действия на какой-либо урл внутри аккаунта стоит использовать  ctx.account.navigate() .

/**
 * Пример: файл catalog.tsx в аккаунте test
 * Экран будет открываться по адресу
 * https://test.chatium.com/catalog
 */
app.screen('/', function(ctx,req) {
    return (
        <screen title="Каталог"/>
            <button onClick={ctx.account.navigate('/')}>
                Перейти на главную
            </button>
        </screen>
    )
})

Определение экранов

Создание экранов и переходы между ними:

Главный экран:

const mainScreen = app.screen ('/', async function(ctx, req) {
  return <screen title="My screen">
      <button 
      onClick={catalogScreen.navigate()}>
        К списку товаров
      </button>
    </screen>
})

Экран каталога:

const catalogScreen = app.screen('/catalog', async function(ctx, req) {
  return <screen title="Каталог. Список товаров">
      {/* Контент списка товаров */}
      <button 
      onClick={ctx.account.navigate('/start')}>
        На главную страницу
      </button>
  </screen>
})

• Метод навигации: Метод .navigate() на константах используется для перехода между экранами.

• Объект ctx.account: Позволяет получать информацию об учетной записи пользователя, что помогает в персонализации и работе с данными пользователя. Этот метод позволяет создать чистую и структурированную систему навигации в приложении Chatium, упрощая добавление новых экранов и управление переходами между ними. Использование ctx.account позволяет эффективно работать с данными пользователя, что может значительно улучшить пользовательский опыт.