【发布时间】：2013-03-20 14:39:20
【问题描述】：
我正在关注本教程：http://adamjspooner.github.com/coffeescript-meet-backbonejs/
到目前为止一切正常，除了当我进入最后一节 (5) 并实现“交换”功能时。发生这种情况时，我会返回“未定义”，而不是应该返回的内容。请参阅教程了解应该发生的情况。
我没有发现代码有什么不同。
我的如下：（在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。
【问题讨论】：
-
我已经摆脱了下划线的 bindAll 函数，并在 render、unrender 和 appendItem 函数上使用了粗箭头。结果相同...
-
您在应该使用
'part1'和'part2'的地方使用'part 2'和'part 1'，这些多余的空格会导致您的问题。