0

现在我正在使用这个代码来点赞一个帖子。我正在使用 jQuery 方法将 Like 更改为 Like 并更改 Like 计数

看法

Streaming.Views.StreamsIndex = Backbone.View.extend({
  events: {
    'click .like-icon': 'post_liked',
  },

  initialize: function(){
    this.model = new Streaming.Models.StreamsIndex();
    this.model.bind('post_likeSuccess', this.post_likeSuccess);
  },

  post_liked: function(event) {
    event.preventDefault();
    event.stopPropagation();
    current_target = $(event.currentTarget);
    liked_id = current_target.attr("id");
    href = current_target.attr('href');
    this.model.like(href, liked_id); // calls model to send API call for Like
  },

  post_likeSuccess: function(data, liked_id) {
    $("#" + liked_id).attr({
        "href": data.unlike,
        "title": "Unlike",
        "rel": "Unlike",
        "class": "likehead-ico_active" // changing like icon
    });
    //changing like count 
    $("#"+ liked_id+"_count").text(parseInt($("#"+ liked_id+"_count").text()) + 1);
  }
});

模型：

Streaming.Models.StreamsIndex = Backbone.Model.extend({
  like: function(href, liked_id) {
    var self = this;
    $.ajax({
        url: href,
        type: "POST",
        dataType: "json",
        async: false,
        success: function (data) {
            self.trigger('post_likeSuccess', data, liked_id);
        },
        error: function (data) {
            self.trigger('post_likeFail', data, liked_id);
            alert("This action was not performed");
        }
    });
  }
});
  1. 有没有更好的方法可以做到这一点？
  2. 喜欢帖子后，我可以将喜欢的文本更改为不喜欢，在不使用 jquery 的情况下以更好的方式更改点赞数吗？
4

1 回答 1

1

这段代码有几个问题。我会尝试一一解决。

  1. 看起来你的里面Streaming.Views.StreamsIndex有几个posts。它应该被分解成一个组件视图，这些视图通过一个集合呈现，以便集合中的每个模型都绑定到一个视图。你可以，也许叫它Streaming.Views.StreamPost

    1. 您的初始化方法将具有：
      this.collection = this.model.posts(); // Or something to this effect
    2. 您的渲染方法将具有：
      // addPost 是一个函数
// 将 'post' 作为参数
// 构建对应的视图对象
// 并将其附加到帖子容器
      
this.collection.each(this.addPost, this) 
      
// addPost 外观示例
      
var view = new Streaming.Views.StreamPost({model: post});
this.$('#posts-container').append(view.render().el);

  2. 事件侦听器应该在上面实例化'click .like-icon': 'post_liked'的新组件视图上。有了这个，你不必使用丑陋的黑客。你总是为了得到. 他的经验法则是在使用 Backbone 时不要使用 jQuery 或任何其他形式的原始 DOM 操作。这就是视图和模板的用途！通过添加一些逻辑（尽可能少）来调整您的模板，以在帖子被喜欢时显示某些内容，如果帖子尚未被喜欢则显示其他内容。决定一个帖子是否被喜欢的工作是由模型来完成的。我通常在调用模型相关方法的视图中编写包装器方法。Streaming.Views.StreamsIndexaddPostcurrent_target = $(event.currentTarget)this.model.get('id')idpostPost

  3. 与其使用自定义事件post_likeSuccess，不如更新模型的状态并重新渲染视图。如果您像我上面提到的那样更新了模板，那么重新渲染将负责您正在执行的所有 DOM 操作。
于 2013-05-31T11:25:41.757 回答