2

我对骨干js有点困惑。

我有多个视图，它们根据会话采取不同的行动。IE。当我登录时，我的所有视图都将允许我点赞评论并关注问题，但是当我注销时，与用户活动相对应的所有其他视图都应提示登录表单。

所以，困惑是，当我登录时我应该如何通知其他视图，以便他们允许我做相应的活动。

我目前能够实现这一点，但我需要在登录后刷新页面，但骨干js的目的没有实现。

用户模型：user.js.coffee

class window.User extends Backbone.Model
  urlRoot: '/users'

  isSignedIn: ->
    Boolean(@get('remember_token'))

  login: (attributes, options) ->
    options.url = Root + '/sessions'
    @save(attributes, options)

  signup: (attributes, options) ->
    options.url = Root + '/users/create'
    @save(attributes, options)

登录视图：signin_view.js.coffee

class window.UserView extends Backbone.View
  initialize: ->
    _.bindAll(this, 'onSignedIn', 'onSignedUp', 'onCommented')
    $(@el).show()

    if @model.isSignedIn()
      @showUserDetails()
    else
      Some code here

用户详情视图：user_detail_view.js.coffee

class window.UserDetailsView extends Backbone.View
  initialize: ->
    _.bindAll(this, 'onValidUser')
    @model.on('change', @onValidUser)

   if (@model.get('email'))
     @onValidUser()
   else
     @model.fetch()

   onValidUser: ->   
     @render()

  render: ->
    $(@el).show()
      this.$(".name").text(currentUser.get('user')['first_name'] + ' ' + currentUser.get('user')['last_name'])

现在我想通知我的关注视图我已登录并且我不应该再提示登录表单了，事实上所有与用户活动相关的视图

跟随视图看起来像这样

class window.FollowView extends Backbone.View
  initialize: ->
    $(@el).show()

我该如何做到这一点？

提前致谢

4

1 回答 1

3

我觉得你有点结构性问题。“已登录”实际上并不是用户的属性，而是整个应用程序的属性：如果他们未登录，则应用程序没有用户，如果他们已登录，则应用程序确实有一个用户。

所以你应该有一个具有用户属性的应用程序对象。人登录时，在应用对象上设置用户；当此人退出时，清除用户。

一旦上述内容到位，解决方案自然会失败：我们正在使用 Backbone，所以一切都基于触发和侦听事件，这里的事件是signed-inand signed-out。是什么触发了这些事件？应用程序对象可以。谁监听这些事件？关心某人是否签名的观点。

假设你有一个这样的应用程序类：

class App
    constructor: (@user_name) ->
        _(@).extend(Backbone.Events);
    sign_out: ->
        @user_name = null
        @trigger('signed-out')
    sign_in: (user)->
        @user_name = user
        @trigger('signed-in')
    user: ->
        @user_name

window.app = new App

然后关心用户的视图可以做这样的事情：

initialize: ->
    app.on('signed-in signed-out', @render)

并且render当有人登录或退出时会调用它们的方法；当然，这些render方法会检查用户并显示适当的东西。

现场演示：http: //jsfiddle.net/ambiguous/TfPf9/

真正的代码可能希望有remove实现app.off('signed-out signed-in')来避免悬空的侦听器。

我在这里的时候还有其他几件事：

  1. bindAllCoffeeScript 很少需要使用。而不是这个：

    _.bindAll(this, 'onSignedIn', 'onSignedUp', 'onCommented')

    定义方法=>：

    onSignedIn: => #...
onSignedUp: => #...

  2. 较新版本的 Backbone 自动为您提供 jQuery/Zepto 包装版本，el因此您可以替换$(@el).show()为@$el.show().

于 2012-04-07T19:36:51.447 回答