Backbone перестает работать, если я удаляю представление в отдельный файл

0

Приводит меня в бешенство, взгляните на этот jsfiddle - это очень упрощенная версия моей проблемы, но это абсолютно демонстративно. Как это работает, но если вы удалите определение AppView

var AppView = Backbone.View.extend({

  el: $("body"),

  initialize: function() {
      console.log('init');
      this.render();
  },

  render: function() {
      console.log('render');
      this.$el.html("123");
  }
});

из "основного" сценария (проверьте сами - то же определение будет по-прежнему включено в раздел "внешние ресурсы") - он перестает работать. Я попытался проверить с помощью console.log если определение все еще доступно в глобальном пространстве имен, и, конечно же, это так. Не имеют ни малейшего представления о.

Обновить:

И даже больше - он не просто доступен - чертовски все работает, как мы можем, в консоли chrome для консоли console.log() но this.$el.html("123"); ничего не влияют!

  • 0
    Я не уверен, что понимаю ваш вопрос. Разница между кодом, который вы разместили, и кодом var app = new AppView заключается в наличии var app = new AppView и определения AppView . Вы спрашиваете, почему код не работает без определения и new AppView части new AppView ?
  • 0
    @GiovanniFilardo да, но имейте в виду, что если вы удалите определение AppView как это - то же самое определение будет по-прежнему включено во внешний файл - посмотрите на external resources в левой части страницы скрипки.
Теги:
backbone.js

1 ответ

1
Лучший ответ

Если вы осмотрите нижнюю правую панель в вашей скрипке, вы можете увидеть, что AppView.js файл включаются в head сгенерированного документа, показанном в IFRAME. Вид определен с элементом el установленным в $ ('body')

el: $ ("body")

Но body Node еще не существует: это пустой объект jQuery.

Внутри ready обратного вызова document jQuery определение AppView находит элемент body, как вы ожидаете.

Я понимаю, что вам нужно переместить определение View в отдельный файл javascript. Вы можете достичь результата разными способами. Наиболее очевидным является включение элемента script который импортирует его внутри элемента body. Лучше всего было бы установить el в методе initialize определения AppView или, что еще лучше, вы могли бы передать элемент в конструктор, как объясняет Кенан в своем комментарии ниже.

  • 0
    Блин, это так просто! Я забыл, что el: $("body") будет выполнено так рано!
  • 0
    Это проблема. Вы можете передать элемент, и тогда он будет работать. var app = new AppView({el:$("body")});
Показать ещё 3 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню