0

Post モデル、PostList コレクション、および PostView + PostListView を持つ簡単なサンプル Backbone.js アプリを作成しようとしています。フォームに投稿できるシンプルなもので、投稿が投稿のリストに追加されます。

誰かが投稿フォームで送信をクリックすると、PostList コレクションのビューである「PostListView」でイベントがトリガーされます。新しい投稿モデルをどこで作成してコレクションに追加しますか? ビュー自体にこのコードを記述しますか? それとも、ビューはこれを行うコレクション メソッドを呼び出しますか? カスタム コレクション メソッドを作成することもできますか? もしそうなら、どうすればそれらをビューから呼び出すことができますか?

Rails のバックグラウンドを持っているので、ビュー (Rails コントローラー) ではなくコレクション/モデルにコードを配置する傾向がありますが、ビューからカスタム コレクション イベントを呼び出す方法がわかりません。

コードは以下の通りです。助けてくれてありがとう!

PostListView.coffee:

class forum.PostListView extends Backbone.View
    tagName: 'section'
    className: 'post-list'

    events:
        'click .post-form button': 'submit'

    initialize: ->
        #causes the view to render whenever the collection's data is loaded
        @collection.bind 'reset', @render
        @collection.bind 'add', @render

    render: =>
        $(@el).html JST['postList']()
        $postList = this.$('.post-list')

        #iterates through posts, renders, appends to <ul>
        @collection.each (post) =>
            view = new forum.PostView
                model: post
                collection: @collection
            $postList.append view.render().el

        return this

    submit: ->
        console.log "submitted!"
        @collection.trigger 'newPost', this.$('.post-form textarea').val()

PostList.coffee:

class forum.PostList extends Backbone.Collection
    model: forum.Post
    url: '/posts'

    initialize: ->
        this.bind 'newPost', newPost

    newPost: (postText) ->
        console.log "Collection method called!!"
        # post = new forum.Post
        #   content: postText

        # @add post
4

2 に答える 2

1

PostListからのメソッドを呼び出してPostListView、コレクションに新しいモデルを追加します。通常のjsではこのようなもの:

this.collection.add( new forum.Post( this.$( ".post-form textarea").val() ) );

私はCoffeeScriptを実行しないので、csでの上記の構文は次のようになると思います。

@collection.add new forum.Post
           this.$( ".post-form textarea").val()

Postに新しいものを追加するのがより複雑な場合PostListは、にそのためのメソッドを追加できます。PostList

this.collection.complexAdd( params... );

PostListクラスを作成する場所にカスタムメソッドを追加しますnewPost。すでにメソッドを使用して追加しました。

ビューは最後に初期化されるため、これはビューイベントをリッスンするコレクションよりもはるかに簡単です。

編集:意見に帰着することもできると思います。一部の人々は、どのバックボーンビューがそれらを使用しているかを知っているモデル/コレクションを好みますが、1つのモデルに複数のビューがある状況(たとえば、TabContentビューとTabSelectorビュー)単一のTabModelの場合)、作業がより複雑になります。

于 2011-11-19T19:40:46.213 に答える
1

次のヒントはあなたを助けるかもしれません...

  1. 新しい投稿フォームを管理することだけを担当する NewPost 用の別のビューがあれば、物事をより適切に分離できるかもしれません。PostListView はそれを作成し、それ自体に追加できます。

  2. 通常、コレクションが保存されるまでは、コレクションに新しいモデルを追加したくありません。そのため、NewPostForm にコレクションへの参照を与え、保存後にそれを追加することができます。

  3. その後、PostList で NewPost ビューをダンプして再作成し、後続の投稿を追加する準備を整えることもできます。

バックボーンの「ビュー」は、Rails のコントローラー アクションに似ている場合があります。したがって、モデルの作成、移動、保存などはすべて、ビュー コードで実行してもまったく問題ありません。

于 2011-11-19T22:18:24.840 に答える