1

私はこのチュートリアルに従っています: http://adamjspooner.github.com/coffeescript-meet-backbonejs/

これまでのところ、最後のセクション (5) に到達して "swap" 関数を実装する場合を除いて、すべて問題ありません。それが起こると、返されるはずのものではなく、「未定義」が返されます。何が起こるかについては、チュートリアルを参照してください。

コードに違いは見つかりませんでした。

私は次のとおりです：（coffeescriptで）

jQuery ->
    class Item extends Backbone.Model
        defaults:
            part1:'Hi'
            part2:'Backbone'

    class List extends Backbone.Collection
        model: Item

    class ItemView extends Backbone.View
        tagName: 'li'

        initialize: ->
            _.bindAll @

            @model.bind 'change', @render
            @model.bind 'remove', @unrender

        render: ->
            $(@el).html """
                <span>#{@model.get 'part1'} #{@model.get 'part2'}!</span>
                <span class="swap btn btn-warning">swap</span>
                <span class="delete btn btn-danger">delete</span>
            """
            console.log @model.get 'part 2'
            @

        unrender: ->
            $(@el).remove()

        swap: ->
            @model.set
                part1: @model.get "part 2"
                part2: @model.get "part 1"

        remove: -> 
            @model.destroy()

        events:
            'click .swap' : 'swap'
            'click .delete' : 'remove'

    class ListView extends Backbone.View
        el: $ 'body'

        initialize: ->
            _.bindAll @

            @collection = new List
            @collection.bind 'add', @appendItem

            @counter = 0
            @render()

        render: ->
            $(@el).append "<button class='btn'>Add List Item</button>"
            $(@el).append "<ul></ul>"

        addItem: ->
            @counter++
            item = new Item
            item.set part2: "#{item.get 'part2'} #{@counter}"
            @collection.add item

        appendItem: (item) ->
            item_view = new ItemView model: item
            $('ul').append item_view.render().el

        events: 'click button' : 'addItem'

    Backbone.sync = (method, model, success, error) ->
        success()

    list_view = new ListView

HTML は次のとおりです。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Backbone App</title>
    <link rel="stylesheet" type="text/css" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css">
</head>
<body>
    <div class="content"></div>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.10/backbone-min.js"></script>
    <script src="app.js"></script>
</body>
</html>

アイテムのスワップ ボタンをクリックしたときに「未定義」が返される理由がわかりません。この問題を見つけることで、Backbone JS をさらに学び、理解するのに役立ちます。

4

1 に答える 1

0

アンダースコアbindAllは現在、1 つのパラメーターのみを持つことを受け入れません。関数をリストするか、 bind で引数を渡す必要があります。

@model.bind 'change', @render, this
于 2013-03-29T20:40:30.043 に答える