![Vue.js从入门到项目实践(超值版)](https://wfqqreader-1252317822.image.myqcloud.com/cover/987/44509987/b_44509987.jpg)
上QQ阅读APP看书,第一时间看更新
5.2.3 与传统事件绑定的区别
![](https://epubservercos.yuewen.com/CC45E5/23721548909464406/epubprivate/OEBPS/Images/Figure-P94_13028.jpg?sign=1738872491-3V0n8vtXo7b9CM6YufiOSyA8gz8D2Mge-0-24d5ae5fc14ee6236e2185f8546c5884)
与传统事件绑定的区别有如下几点。
(1)无须手动管理事件。ViewModel被销毁时,所有的事件处理器都会自动被删除,重新获取DOM绑定事件,然后在特定情况下解绑,最后解脱出来。
(2)解耦。ViewModel代码是纯粹的逻辑代码,和DOM无关,有利于将代码逻辑写成自动化测试用例。
(3)Vue.extend()。为了重复使用子组件,Vue.js提供了Vue.extend(options)方法创建基础Vue构造器的“子类”,参数options对象和直接声明Vue实例参数对象基本一致。
![](https://epubservercos.yuewen.com/CC45E5/23721548909464406/epubprivate/OEBPS/Images/Figure-P94_53240.jpg?sign=1738872491-F2XUbpxgNaVVwBJQbaaUc01psfevz1N4-0-51ebeb56f4e4fe257165735cee6c1a63)
运行效果如图5-12所示。
![](https://epubservercos.yuewen.com/CC45E5/23721548909464406/epubprivate/OEBPS/Images/Figure-P94_13008.jpg?sign=1738872491-RjgHStSu9OSfy7NDxp5NnRMYUrEwSCWm-0-03ed805217738b5719f48d9613b5b36f)
图5-12 与传统事件绑定的区别运行效果