Отключение автозапуска

В библиотеке Page.js автозапуск маршрутизатора происходит сразу после его подключения и конфигурации маршрутов. По умолчанию вызов page() без параметров запускает обработку текущего URL, что может быть нежелательно в случаях, когда требуется выполнить дополнительную инициализацию или динамическую регистрацию маршрутов перед стартом навигации. Для управления этим процессом используется метод page.start() и параметр dispatch: false.

Контроль автозапуска через page.start()

Метод page.start() служит для явного запуска маршрутизатора. Если не вызывать его сразу, Page.js не будет обрабатывать текущий URL до тех пор, пока не произойдет вызов start.

Пример:

page('/home', () => {
  console.log('Главная страница');
});

page('/about', () => {
  console.log('Страница о нас');
});

// Автозапуск отключен
// page.start(); // не вызываем сразу

В этом примере маршруты зарегистрированы, но переход на текущий URL не выполняется автоматически.

Использование опции dispatch: false

Для отключения обработки текущего URL при старте маршрутизатора применяется параметр dispatch. По умолчанию dispatch равен true, что приводит к немедленной навигации. Установка dispatch: false предотвращает вызов обработчиков маршрутов для текущего пути:

page.start({ dispatch: false });

Пояснение:

  • dispatch: true — маршрутизатор сразу вызывает соответствующий обработчик для текущего URL.
  • dispatch: false — обработчики вызываются только при последующих переходах (page.show или page(path)).

Такой подход особенно полезен при динамической подгрузке данных или компонентов перед рендерингом.

Примеры практического применения

  1. Регистрация маршрутов после асинхронной загрузки данных:
fetch('/routes.json')
  .then(res => res.json())
  .then(routes => {
    routes.forEach(r => page(r.path, r.handler));
    
    // Запуск после регистрации всех маршрутов
    page.start({ dispatch: false });
  });
  1. Условная навигация при старте:
page('/dashboard', () => console.log('Dashboard'));
page('/login', () => console.log('Login'));

// Решение о редиректе принимается динамически
const userLoggedIn = false;

page.start({ dispatch: false });

if (userLoggedIn) {
  page('/dashboard');
} else {
  page('/login');
}

В этом случае текущий URL не обрабатывается автоматически. Роутинг запускается только после принятия решения, что предотвращает ненужные редиректы.

Отключение автозапуска и управление историей

Метод page.start() также принимает параметры popstate и hashbang, влияющие на обработку истории браузера. Комбинация с dispatch: false позволяет полностью контролировать навигацию:

page.start({ 
  dispatch: false, 
  popstate: true, 
  hashbang: false 
});
  • popstate: true — позволяет реагировать на кнопки «назад/вперед».
  • hashbang: false — отключает использование хэш-адресов для маршрутов.

Таким образом, отключение автозапуска не ограничивается только блокировкой текущего URL — оно становится частью гибкой стратегии управления навигацией и истории.

Ключевые моменты

  • page.start({ dispatch: false }) — основной способ отключить автозапуск.
  • Маршруты можно регистрировать до вызова start, что важно для динамических приложений.
  • Управление историей и переходами после отключения автозапуска дает полный контроль над навигацией.
  • Позволяет интегрировать Page.js с асинхронной загрузкой данных, авторизацией и динамическим рендерингом компонентов.

Такой подход обеспечивает безопасное и предсказуемое поведение маршрутизатора, предотвращая ненужные срабатывания обработчиков до полной готовности приложения.

Оглавление