Backbone.js маршрутизация без изменения URL-адреса

Я переношу одностраничное веб-приложение на основе Backbone.js и jQuery на расширение Chrome. Однако ни режим pushState, ни режимы маршрутизатора на основе hashbang, похоже, хорошо работают со средой внутри расширения. Я пришел к выводу, что мне лучше просто визуализировать взгляды на пользовательские взаимодействия, вообще обходя систему window.location. Однако я не слишком уверен, как реализовать это, не меняя обращения к Router.navigate в десятках файлов.

Есть ли подключаемый/модульный способ сохранения магистральной системы маршрутизации, но обойти любые изменения в URL?

Ответы

Ответ 1

Я действительно хочу использовать Router.navigate для использования системы маршрутизации, которую Backbone.js предоставляет без необходимости иметь дело с ошибками hashbang при использовании в расширении Chrome (например, маршруты, включая слэш, который перезаписывается), вы можете make Router.navigate загрузить url напрямую, пропуская целую гимнастику PushState.

На самом деле это довольно легко выполнить:

Router = Backbone.Router.extend({

  navigate: function (url) {

    // Override pushstate and load url directly
    Backbone.history.loadUrl(url);

  },

  // Put routes here
  routes: { }

});

Затем вы можете вызвать Router.navigate(url) для загрузки нового маршрута без изменения истории или даже привязать действие к каждой ссылке, содержащей атрибут data-backbone (например, <a href="login" data-backbone>Login</a>), с таким событием:

$(function(){

  // Initialize router
  Router = new Router;
  Backbone.history.start();

  // Bind a[data-backbone] to router
  $(document).on('click', 'a[data-backbone]', function(e){
    e.preventDefault();

    Router.navigate( $(this).attr('href') );
  });

});

Ответ 2

Вы можете переопределить, что делает Router.navigate, но вам лучше не использовать Background.router вообще. Я думаю, что это может создать некоторую путаницу, и ваш код будет чище без него, если вы в настоящее время запускаете изменения истории из представлений.

Backbone.Marionette имеет концепцию контроллеров, которые очень похожи на маршрутизаторы без URL-карты (с Marionette, идея состоит в том, чтобы держите свои определения маршрута минимальными, а вместо этого управляйте контроллерами вызовов). Вам также не нужно использовать какие-либо компоненты Marionette, которые вам не нужны.

Если вы действительно хотели придерживаться маршрутизатора как есть, вы могли бы просто переопределить Backbone.History.navigate на (отметить, непроверено)

navigate: function(fragment, options) {
    if (!History.started) return false;
    if (!options || options === true) options = {trigger: options};
    fragment = this.getFragment(fragment || '');
    if (this.fragment === fragment) return;
    this.fragment = fragment;     
    if (options.trigger) this.loadUrl(fragment);
}