我正在尝试一个简单的测试。从 json 编码的 php 数组填充 Backbone 集合。
var MyObjectModel = Backbone.Model.extend({
parse:function(response){
return JSON.parse(response);
}
});
var MyObjectView = Backbone.View.extend({
template: _.template('<a id="<%= id %>" href="#"><%= name %></a> '),
render: function(){
this.$el.html(this.template(this.model.attributes));
return this;
}
});
var MyList = Backbone.Collection.extend({
url: 'testRest.php',
model: MyObjectModel
});
var MyListView = Backbone.View.extend({
el:$("#app"),
initialize: function(){
this.collection.on('add',this.addOne,this);
this.collection.on('reset',this.addAll,this);
},
addOne: function(objectModel){
var objectView = new MyObjectView({model: objectModel});
this.$el.append(objectView.render().el);
},
addAll: function(){
this.$el.empty();
this.collection.forEach(this.addOne,this);
},
render: function(){
return this;
}
});
var myList = new MyList();
var myListView = new MyListView({collection:myList});
myList.fetch().done(function(){
myListView.render();
});
HTML 页面尽可能基本
<!DOCTYPE html>
<html>
<head>
<title>TEST</title>
</head>
<body>
<div id="app"></div>
<script type="text/javascript" src="jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="underscore-min.js"></script>
<script type="text/javascript" src="backbone-min.js"></script>
<script type="text/javascript" src="test2.js"></script>
</body>
</html>
当文件 testRest.php 包含时它工作正常
echo json_encode("{\"id\":\"4\",\"name\":\"one\",\"color\":\"ff6600\",\"phoneNumber\":\"+123456789\"}");
但是一旦我尝试在返回的对象中包含多个项目:
echo json_encode("[{\"id\":\"4\",\"name\":\"one\",\"color\":\"ff6600\",\"phoneNumber\":\"+123456789\"},{\"id\":\"1\",\"name\":\"two\",\"color\":\"800080\",\"phoneNumber\":\"\"}]");
我有一个错误:
Uncaught ReferenceError :id 未定义
有人遇到同样的问题吗？我错过了什么吗？
提前致谢。
最佳答案
您的 Backbone 代码没有任何问题，但您的 php 脚本有两处错误:
1) 将 Content-type header 设置为 json
2) json_encode 采用 php 数组
<?php
header('Content-Type: application/json');
$resp = array(
array(
'id' => 4,
'name' => 'one',
'color' => 'ff6600',
'phoneNumber' => '+123456789'
),
array(
'id' => 1,
'name' => 'two',
'color' => '80080',
'phoneNumber' => ''
)
);
echo json_encode($resp);
正如我在评论中所说，只要设置了 Content-type header ，您就不需要执行 JSON.parse jQuery 已经解析为对象。用于解析的默认 Backbone 方法已经返回响应对象，因此您根本不需要覆盖(除非您正在获取嵌套数据)。
关于javascript - 使用 json 编码的 php 数组填充 Backbone 集合，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25086516/