1

我有一个正在开发的 Backbone.js 应用程序（如果这是一个愚蠢的问题，请原谅我的第一个应用程序）。我有一个标题视图（背景和标题）。我有一个模型，它根据呈现的视图/模板更新标题。我还听取了更改并重新渲染视图以显示新标题。这可行，但是整个视图被重新渲染（我知道它为什么再次渲染整个视图）但是想知道是否有办法只更新标题？

标题视图：

var HeadingLabelView = Backbone.View.extend({
   el: '.heading-label-wrapper',
   initialize: function(){
      _.bindAll(this, "render");
      this.model.bind('change', this.render);
   },
   render: function() {
      var that = this;
      var template = _.template($("#heading-label-template").html(), that.model.toJSON());
      that.$el.html(template);
   }
});

登录视图：

var LoginView = Backbone.View.extend({
   el: '.page',
   render: function() {
      pageHeading.set({ name: "Log In" });
      var that = this;
      var template = _.template($("#login-template").html(), { });
      that.$el.html(template).trigger('create');
   }
});
4

1 回答 1

1

我认为您可以通过仅侦听模型名称属性的更改事件来做到这一点

var HeadingLabelView = Backbone.View.extend({
   el: '.heading-label-wrapper',
   initialize: function(){
      _.bindAll(this, "render");
      this.model.bind('change', this.render);
      this.model.bind('change:name', this.renderTitle);//listen to changes on the 'name' property
   },
   render: function() {
      var that = this;
      var template = _.template($("#heading-label-template").html(), that.model.toJSON());
      that.$el.html(template);
   },
   renderTitle: function(model,value,options) {
      //assuming your title tag can be located with 'heading-label-title' id, this will update the title only
      this.$("#heading-label-title").html(value);
   },
});

查看backbonejs.org 上的内置事件目录，您应该只能监听模型特定属性的更改。

于 2013-10-27T21:23:24.277 回答