事件绑定

通过ev-*属性，可以在dom上绑定事件

例如：

    1.   <button ev-click={function() { alert('点击了按钮') }}>点击按钮</button>

绑定方法

大多数情况下，事件处理函数都比较复杂，直接写在模板中不太优雅。
一般通过将事件处理传入模板的render方法，来进行绑定

例如：

    1.   <button ev-click={onClick.bind(self)}>点击了{count}次</button>
    1.   var vdt = Vdt(template);
    2.   vdt.render({
    3.       count: 0,
    4.       onClick: function() {
    5.           this.count++;
    6.           // 调用update方法去更新dom
    7.           vdt.update();
    8.       }
    9.   })

事件处理函数中this默认指向window，我们可以bind(self)让它指向渲染到模板的数据`

传入参数

你可以通过bind()方法，向事件处理函数中传入参数

    1.   <div>
    2.       点击下面的名字
    3.       <ul>
    4.           <li v-for={users} 
    5.               ev-click={onClick.bind(self, value)}
    6.           >{value}</li>
    7.       </ul>
    8.   </div>
    1.   var vdt = Vdt(template);
    2.   vdt.render({
    3.       users: ['Syalvia', 'Shadow', 'Javey'],
    4.       onClick: function(user) {
    5.           alert('你点击的是' + user);
    6.       }
    7.   })

事件对象

事件处理函数的最后一个参数为事件对象，通过它我们可以访问事件的属性和方法 

    1.   <div ev-click={onClickParent.bind(self)}>
    2.       点击父元素
    3.       <p ev-click={onClickChild.bind(self)}>点击子元素</p>
    4.   </div>
    1.   var vdt = Vdt(template);
    2.   vdt.render({
    3.       onClickParent: function(event) {
    4.           alert('你点击的是父元素，target: ' + event.target.tagName);
    5.       },
    6.       onClickChild: function(event) {
    7.           alert('你点击的是子元素，target: ' + event.target.tagName);
    8.       }
    9.   })

我们可以通过event.stopPropagation()来阻止冒泡，

    1.   <div ev-click={onClickParent.bind(self)}>
    2.       点击父元素
    3.       <p ev-click={onClickChild.bind(self)}>点击子元素</p>
    4.   </div>
    1.   var vdt = Vdt(template);
    2.   vdt.render({
    3.       onClickParent: function(event) {
    4.           alert('你点击的是父元素，target: ' + event.target.tagName);
    5.       },
    6.       onClickChild: function(event) {
    7.           // 让事件冒泡
    8.           event.stopPropagation();
    9.           alert('你点击的是子元素，target: ' + event.target.tagName);
    10.       }
    11.   })