如何在主干中重新渲染部分模型？

Question

我有一个如下的答案列表：

每个列表项都是一个骨干模型。

{
  title: 'answer title...',
  content: 'answer content...',
  voteStatus: 'up'
}

当我点击赞成票或反对票时，模型的 voteStatus 将会改变，并且这个答案项目将被重新渲染。

如果答案的内容中有图片，图片也会重新渲染，但这不是我想要的。

当我刚刚更改时，如何重新渲染投票按钮 voteStatus?

Answer 1

在你的里面有一个子视图 AnswerView 只负责渲染投票箭头， VotingArrowsView. 。您可以在 initialize 的函数 AnswerView 然后在子视图前面添加 el 到父视图的 el 什么时候 rendering 父视图：

var AnswerView = Backbone.View.extend({
  initialize: function(options){
    this.template = _.template($('#answerTmpl').html());
    this.votingArrowsView = new VotingArrowsView({ model: this.model });
    ...
  },
  render: function(){
    this.$el.html(this.template(this.model.toJSON()));
    this.$el.prepend(this.votingArrowsView.render().el);
    return this;
  },
  ...
});

var VotingArrowsView = Backbone.View.extend({
  initialize: function(options){
    this.template = _.template($('#votingArrowsTmpl').html());
    this.listenTo(this.model, 'change:voteStatus', this.render);
  },
  render: function(){
    this.$el.html(this.template(this.model.toJSON()));
    return this;
  }
});