Backbone.js之view篇(三)

Backbone 的 Views 用来接收用户的操作和修改 Model 的数据 ，另外通过 render 来展示数据.

实际上，在MVC框架中，它更像是Controller。

View有两个作用：

1.监听事件

2.展示数据

下面简单的创建一个View：

 

1. GameView= Backbone.View.extend({ 
2.   tagName : "div", 
3.   className: "game", 
4.   render : function() { 
5. // code for rendering the HTML for the view
6.   } 
7. }); 

下面让我们看看render部分应该怎么写。如下：

1. render : function() { 
2. this.el.innerHTML = this.model.get('name'); 
4. //Or the jQuery way
5. $(this.el).html(this.model.get('name')); 
6. } 

更全面的示例：

        var DocumentView = Backbone.View.extend({

         events: { 

1. "dblclick"                : "open", 
2. "click .icon.doc"         : "select", 
3. "contextmenu .icon.doc"   : "showMenu", 
4. "click .show_notes"       : "toggleNotes", 
5. "click .title .lock"      : "editAccessLevel", 
6. "mouseover .title .date"  : "showTooltip"
7.   }, 
9.   render: function() { 
10.     $(this.el).html(this.template(this.model.toJSON())); 
11. return this; 
12.   }, 
14.   open: function() { 
15.     window.open(this.model.get("viewer_url")); 
16.   }, 
18.   select: function() { 
19. this.model.set({selected: true}); 
20.   }, 
22.   ... 
24. }); 

events部分是监听的事件，下面的open、select方法是事件对应的处理。

 

本文引用：http://blog.csdn.net/feng88724/article/details/7290338