使用带有 jQ​​uery 的 fadeOut() 的 Backbone.js View remove() 方法

Question

我相信我的标题几乎解释了我希望实现的目标，我有一个主干视图，其中包含一个通过 view.remove() 删除自身的事件

更准确地说：

class Project.Views.MemberView extends Backbone.View
  template: JST['members/member_view']

  events:
    'click .destroy-member': 'removeMember'

  initialize: ->
    _.bindAll(this, "render")

  render: ->
    $(@el).html(@template(member: @model))
    this

  removeMember: ->
    @model.destroy
      data:
        collective_id: gon.collective.id
      contentType: 'application/json'
      success: =>
        @remove() #view.remove() called here

对 view.remove() 的调用运行良好且符合预期，但是它会立即从 DOM 中删除元素（视图），我认为这不是很好的用户体验。

我需要知道的是，如果有办法 wrap 或 chain 使用 Jquery fadeOut() 调用 view.remove()。在我看来，这将大大改善用户体验。

这可能吗？

干杯！

Answer 1

你为什么不在删除之前调用fadeOut？我不熟悉coffeescript，但在你调用模型销毁之前，只需执行以下操作：

removeMember: ->
    // whatever el you want to remove, just fade it out. from your code maybe its $(@el) ?:
    @model.destroy
      data:
        collective_id: gon.collective.id
      contentType: 'application/json'
      success: =>
        $(@el).fadeOut()

Answer 2

fadeOut() 有一个成功回调 - 我建议将它用于您的 @remove() 调用：

removeMember: ->
  @model.destroy
    data:
      collective_id: gon.collective.id
    contentType: 'application/json'
    success: =>
      $(@el).fadeOut(100, @remove())