Backbone.js: «Максимальный размер стека вызовов превышен»

Question

Предположим, у меня есть модель и представление, у ths view есть два метода: один связывает событие mousemove документа, а другой - метод unbind, defalut Я даю документ mousemove событие, когда-то ценность модели enable изменилась, я буду называть отвязать метод отображения вида:

window.ConfigModel = Backbone.Model.extend({ 
     defaults: { 
      'enable':0 
     }, 
     initialize: function(){ 
      this.bind("change:enable", function() { 
       var portView2 = new PortView(); 
       portView2.viewOff();       
      }); 
     }, 
     change:function() { 
      this.set('enable', 9); 
     } 
    }) 

    window.PortView = Backbone.View.extend({ 
     viewOn: function() { 
      $(document).on('mousemove', function() { 
       console.log('move') 
      }) 
     }, 
     viewOff: function() { 
      $(document).off('mousemove'); 
     } 
    }) 

тогда я положил input на документ, чтобы назвать модель изменилась:

$('input').click(function() { 
     var configModel = new ConfigModel(); 
     configModel.change(); 
    }) 

загрузочный скрипт:

var portView1 = new PortView(); 
portView1.viewOn(); 

Проблема заключается в том, когда я называю нажмите кнопку ввода, хром сказал бы мне об ошибке: Maximum call stack size exceeded это кажется change будет вызывать много times.So, что проблема с моей проблемой, как я могу решить эту проблему

Answer 1

модели Магистральные уже есть change method:

changemodel.change()

Manually trigger the "change" event and a "change:attribute" event for each attribute that has changed. If you've been passing {silent: true} to the set function in order to aggregate rapid changes to a model, you'll want to call model.change() when you're all finished.

Предположительно что-то внутри Backbone пытается вызвать configModel.change() и получить вашу версию change, которая запускает другой change() вызов внутри B ackbone, который запускает ваш change, который ... пока стек не взорвется.

Вы должны использовать другое имя для своего метода change.

---

Сказанное: ваша структура кода несколько странная. Модель прослушивания событий на самом по себе хорошо, но модель создания представления нечетная:

initialize: function() { 
    this.bind("change:enable", function() { 
     var portView2 = new PortView(); 
     portView2.viewOff();       
    }); 
} 

И инстанцирование вида просто назвать один метод, а затем выбросить его странно как создание новой модели просто для запуска события.

Я думаю, вы, вероятно, захотите, чтобы один экземпляр ConfigModel был частью вашего состояния приложения, скажем app.config. Тогда ваш click обработчик будет говорить с этой моделью:

$('input').click(function() { 
    app.config.enable_level_9(); // or whatever your 'change' gets renamed to 
}); 

Тогда вы бы иметь какую-то другую часть приложения (не обязательно вида), который прослушивает изменения в app.config и действует соответствующим образом:

app.viewOn = function() { 
    $(document).on('mousemove', function() { 
     console.log('move') 
    }); 
}; 
app.viewOff = function() { 
    $(document).off('mousemove'); 
}; 
app.init = function() { 
    app.config = new ConfigModel(); 
    app.viewOn(); 
    $('input').click(function() { 
     app.config.enable_level_9(); 
    }); 
    // ... 
}; 

А затем запустить приложение с помощью одного app.init() вызова:

$(function() { 
    app.init(); 
});