我遇到了一个问题:Backbone model .toJSON() doesn't render all attributes to JSON
但我通过model.set({"mid": "123"});
设置模型的属性通过chrome的调试我打印下面的信息列表:
console.log(model);
console.log(model.attributes);
console.log(model.toJSON());
我发现中间的钥匙消失了。我不知道为什么,谁能帮帮我?
attributes: Object
age: "123"
carrer: "123"
id: "8d7c79a0-7517-b279-646f-2838abaf4538"
mid: 6
name: "123"
sex: "0"
Object {name: "123", sex: "0", age: "123", carrer: "123", id: "8d7c79a0-7517-b279-646f-2838abaf4538"}
这是一个演示: / ** *骨干演示 * / $(函数(){
//Model,单个Employee模型
var Employee = Backbone.Model.extend({
initialize: function(){
this.on('invalid', function(model, error) {
alert(error);
});
},
defaults: {
name: "test",
sex: "男",
age: 25,
carrer: "test"
},
validate: function(data){
//...
}
});
//Collection- Employee集合
var EmployeeCollection = Backbone.Collection.extend({
model: Employee,
localStorage: new Store("employees")
});
var employees = new EmployeeCollection();
//View
var EmployeeView = Backbone.View.extend({
tagName: "tr",
template: _.template($("#item-template").html()),
events: {
"dblclick td": "edit",
"blur input,select": "close",
"click a.del": "delOne"
},
initialize: function() {
this.model.on("change", this.render, this);
this.model.on("destroy", this.remove, this);
},
render: function() {
$(this.el).html(this.template(this.model.toJSON()));
return this;
},
edit: function(e){
var val = $(e.currentTarget).text();
$(e.currentTarget).addClass("editing").find("input,select").val(val).focus();
},
close: function(e){
var key = $(e.currentTarget).attr("name"),
val = $(e.currentTarget).val();
this.model.set(key, val);
$(".editing").removeClass("editing");
},
remove: function(){
$(this.el).remove();
},
delOne: function() {
this.model.destroy();
}
});
var AppView = Backbone.View.extend({
el: $("#app"),
events: {
"click #add-btn": "updateModel"
},
initialize: function() {
employees.on("add", this.addOne, this);
// 调用fetch的时候触发reset
employees.bind('reset', this.addAll, this);
employees.fetch();
},
updateModel: function(e) {
var employee = new Employee(),
attr = {};
$('#emp-form input,#emp-form select').each(function() {
var input = $(this);
attr[input.attr('name')] = input.val();
});
employee.on('invalid', function(model, error) {
alert(error);
});
if (employee.set(attr, {validate: true})) {
employees.create(employee, {wait: true});
}
},
addOne: function(employee) {
employee.set({
"mid": employee.get("mid") || employees.length
});
var view = new EmployeeView({
model: employee
});
$(".emp-table tbody").append(view.render().el);
},
addAll: function(){
employees.each(this.addOne);
}
});
var app = new AppView();
});
以下代码是backbone-localstorage.js的一部分:
create: function(model) {
if (!model.id) {
model.id = guid();
model.set(model.idAttribute, model.id);
}
console.log(model);
console.log(model.attributes);
console.log(model.toJSON());
console.log(JSON.stringify(model));
this.localStorage().setItem(this.name + "-" + model.id, JSON.stringify(model));
this.records.push(model.id.toString());
this.save();
return this.find(model);
}