Feng erdong's Blog

Life is beautiful

Backbone体验 -- Model篇

| Comments

Model

在Backbone的理念中, 一个Model应该算是存在于客户端的与服器端resource/entity对应的一个JS对象, 定义一个Model很简单:

1
2
3
4
5
6
7
8
9

TodoItem = Backbone.Model.extend({
    defaults: {
        title: '',
        completed: false
    },
    validate: function (attributes) {
      // validation goes here
    }
})

创建一个Model的实例就是创建一个对象 var todoItem = new TodoItem(), 下面对定义在Model中的常用属性做一下说明(这些属性其实是一些钩子, Backbone希望我们去重写这些属性)

  • defaults

    通过这个属性来指定Model的默认值

    当创建Model实例的时候没有传入对象来初始化, 那么这个实例的属性就与defaults指定的属性值是一致的, 如:

1
2
3

var todoItem = new TodoItem();
console.log(JSON.stringify(todoItem.toJSON()));
// {"title":"","completed":false}

当创建Model实例时传入了对象, 那么这个对象会跟defaults进行merge

1
2
3

var todoItem = new TodoItem({"newAttr": "valueOfNewAttr", "title": "Build a time machine"});
console.log(JSON.stringify(todoItem.toJSON()));
// {"newAttr":"valueOfNewAttr","title":"Build a time machine","completed":false}

  • validate

    将对Model的验证逻辑放在这个属性对应的方法中, 一般情况下, 我们不会直接调用这个validate方法, 它扮演的角色有点像实现定义在父类中的抽象方法, 这个方法会在Model的其他方法中被用到, 比如以下的这些方法:

    isValid()

    我们可以调用Model上的isValid()方法来判断这个Model上的属性值满足验证条件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

TodoItem = Backbone.Model.extend({
defaults: {
    title: '',
    completed: false
},
validate: function (attributes, options) {
    if (attributes.title.indexOf("<") != -1) {
        return "html tag is now allowed is title"
    }
}
});
var todoItem = new TodoItem({
    "title": "<script>...</script>"
});
console.log(todoItem.isValid());
// false

save() or set()

默认情况下调用Model的save()方法会触发validate(), 可以通过在save()的时候使用option {validate: false}来跳过验证. 类似的, 也可以在set()时通过option {validate: true}来触发验证.

validate()方法的返回值比较有趣, 如果验证通过了, 则什么都不用返回, 如果验证失败了, 则需要返回点什么(字符中或是对象都可以).

validate()方法验证失败之后有两件事件会发生:

  • 将validate()返回的结果添加到Model中, 可以通过model.validationError来访问
  • 在Model上触发invalid事件, 并像model和error绑定对回调函数上

Comments