Backbone.js и pushState

Если я включаю pushState в магистральном маршрутизаторе, нужно ли мне использовать return false на всех каналах или магистраль обрабатывает это автоматически? Есть ли примеры, как HTML-часть, так и сценарий.

4 ответа

Решение

Вот шаблон, который Тим Браньен использует в своем шаблоне:

initializeRouter: function () {
  Backbone.history.start({ pushState: true });
  $(document).on('click', 'a:not([data-bypass])', function (evt) {

    var href = $(this).attr('href');
    var protocol = this.protocol + '//';

    if (href.slice(protocol.length) !== protocol) {
      evt.preventDefault();
      app.router.navigate(href, true);
    }
  });
}

Используя это, вместо того, чтобы по отдельности делать protectDefault для ссылок, вы позволяете маршрутизатору обрабатывать их по умолчанию и делать исключения, имея data-bypass приписывать. По моему опыту, это хорошо работает как шаблон. Я не знаю каких-либо замечательных примеров вокруг, но попробовать это самому не должно быть слишком сложно. Красота позвоночника заключается в его простоте;)

 $(document.body).on('click', 'a', function(e){
   e.preventDefault();
   Backbone.history.navigate(e.currentTarget.pathname, {trigger: true});
 });

match() или же startsWith() (ES 6) также можно использовать для проверки протокола. Если вы хотите поддерживать абсолютные URL-адреса pathname свойство, проверьте базовые URL по location.origin,

function(evt) {
  var target = evt.currentTarget;
  var href = target.getAttribute('href');

  if (!href.match(/^https?:\/\//)) {
    Backbone.history.navigate(href, true);
    evt.preventDefault();
  }
  // or

  var protocol = target.protocol;

  if (!href.startsWith(protocol)) {
    // ...
  }
  // or

  // http://stackru.com/a/25495161/531320
  if (!window.location.origin) {
    window.location.origin = window.location.protocol 
     + "//" + window.location.hostname
     + (window.location.port ? ':' + window.location.port: '');
  }

  var absolute_url = target.href;
  var base_url = location.origin;
  var pathname = target.pathname;

  if (absolute_url.startsWith(base_url)) {
    Backbone.history.navigate(pathname, true);
    evt.preventDefault();
  }
}

Вы можете предотвратить поведение по умолчанию, нажав на <a> теги в HTML. Просто добавьте ниже код внутри <script /> тег.

<script>
$(document).on("click", "a", function(e)
{
    e.preventDefault();
    var href = $(e.currentTarget).attr('href');
    router.navigate(href, true);router
});
</script>
Другие вопросы по тегам