这里所指的angularjs是只angu【原创不易,请尊重版权】本文版权归作者所有,未经授权不得转载。lar早期的1.x版本。虽然vue, r【原创内容,转载请注明出处】【转载请注明来源】eact在热度上已经碾压angularj本文作者:唐霜,转载请注明出处。【版权所有,侵权必究】s几条街,但是在面对web开发(以DOM著作权归作者所有,禁止商业用途转载。转载请注明出处:www.tangshuang.net为中心的开发)中,某些场景下面,angu本文版权归作者所有,未经授权不得转载。著作权归作者所有,禁止商业用途转载。larjs可能比任何框架或库都做得好。这【版权所有,侵权必究】【版权所有】唐霜 www.tangshuang.net里,主要举例两个点。
【转载请注明来源】【转载请注明来源】【版权所有】唐霜 www.tangshuang.netModal弹窗的隐现
转载请注明出处:www.tangshuang.net【作者:唐霜】【访问 www.tangshuang.net 获取更多精彩内容】本文作者:唐霜,转载请注明出处。现在是单向数据流和immutable的天【转载请注明来源】【原创内容,转载请注明出处】下,其目的是为了数据流所蕴含的业务流清晰【本文受版权保护】著作权归作者所有,禁止商业用途转载。,但代价是代码编写变得复杂。举一个例子,【版权所有,侵权必究】【关注微信公众号:wwwtangshuangnet】用react写一个弹出框modal,按照著作权归作者所有,禁止商业用途转载。原创内容,盗版必究。单向数据流的范式,必须将modal的隐现本文作者:唐霜,转载请注明出处。本文作者:唐霜,转载请注明出处。通过一个prop来控制,而这个prop必【未经授权禁止转载】本文作者:唐霜,转载请注明出处。须由外部组件传入,为了控制这个prop,未经授权,禁止复制转载。著作权归作者所有,禁止商业用途转载。就必须再配合一个回调函数来触发prop的著作权归作者所有,禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net改变。这是对modal组件而言,而对于外【作者:唐霜】本文版权归作者所有,未经授权不得转载。层调用modal组件而言,必须自建一个s著作权归作者所有,禁止商业用途转载。转载请注明出处:www.tangshuang.nettate传给对应的prop,同时,必须自【访问 www.tangshuang.net 获取更多精彩内容】【原创内容,转载请注明出处】建一个方法作为回调函数传给modal。这转载请注明出处:www.tangshuang.net【版权所有】唐霜 www.tangshuang.net里面编程出错的几率远远大于保证业务流正确本文作者:唐霜,转载请注明出处。未经授权,禁止复制转载。的几率,也就是成本的提升。因为,你必须在【转载请注明来源】【原创内容,转载请注明出处】回调函数中,正确处理state的变化值。
原创内容,盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net转载请注明出处:www.tangshuang.net而双向数据绑定则完全不需要,传入prop【版权所有,侵权必究】著作权归作者所有,禁止商业用途转载。之后,不需要再在回调函数中修改state【原创不易,请尊重版权】转载请注明出处:www.tangshuang.net,双向绑定逻辑会自动修改state。(当著作权归作者所有,禁止商业用途转载。本文版权归作者所有,未经授权不得转载。然,这基于不同的数据思想,一个是immu转载请注明出处:www.tangshuang.net【未经授权禁止转载】table,一个是mutable,各自不著作权归作者所有,禁止商业用途转载。【转载请注明来源】同。)虽然基于的范式不同,但是一个mod本文版权归作者所有,未经授权不得转载。【本文受版权保护】al的显示和隐藏在双向数据绑定范式下,更【本文首发于唐霜的博客】【本文首发于唐霜的博客】有利。
【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】【作者:唐霜】本文版权归作者所有,未经授权不得转载。表格固定列
【原创不易,请尊重版权】转载请注明出处:www.tangshuang.net未经授权,禁止复制转载。Web表格(grid table)是前端【本文首发于唐霜的博客】【本文受版权保护】交互领域及其复杂的一个场景。其中的一个需【访问 www.tangshuang.net 获取更多精彩内容】【本文首发于唐霜的博客】求是,固定表格的前n列,剩下的可以左右滑著作权归作者所有,禁止商业用途转载。【版权所有,侵权必究】动来查看。在基于 virtual dom原创内容,盗版必究。【版权所有】唐霜 www.tangshuang.net 的 vue, react 编程中,自己【访问 www.tangshuang.net 获取更多精彩内容】原创内容,盗版必究。手写是及其麻烦的,你需要手动在模板中拆分【作者:唐霜】【本文受版权保护】块,在脚本中拆分数据。总之,由于virt本文作者:唐霜,转载请注明出处。【原创不易,请尊重版权】ual dom的编程范式如此,本身就是要转载请注明出处:www.tangshuang.net【版权所有】唐霜 www.tangshuang.net隔绝dom的操作。但是实际上,在前端领域【未经授权禁止转载】【转载请注明来源】,grid table的操作往往是vir本文作者:唐霜,转载请注明出处。【本文受版权保护】tual dom最早提出来的,基于数据变【版权所有,侵权必究】未经授权,禁止复制转载。化,只修改小部分dom的需求。但是,实际著作权归作者所有,禁止商业用途转载。本文版权归作者所有,未经授权不得转载。上最终,virtual dom类编程,在【本文首发于唐霜的博客】【关注微信公众号:wwwtangshuangnet】这个点上,反而是最辣鸡的。辣鸡之点不在于本文版权归作者所有,未经授权不得转载。【未经授权禁止转载】性能,而在于编程的复杂。
【作者:唐霜】本文作者:唐霜,转载请注明出处。著作权归作者所有,禁止商业用途转载。而使用angularjs则太过便利。首先本文作者:唐霜,转载请注明出处。转载请注明出处:www.tangshuang.net,angularjs也是基于数据响应更新【本文首发于唐霜的博客】【本文受版权保护】界面的。其次,angularjs是基于D本文作者:唐霜,转载请注明出处。未经授权,禁止复制转载。OM操作进行渲染的。所以,在angula【原创不易,请尊重版权】【原创内容,转载请注明出处】rjs中,如果要实现表格固定列的需求,只【访问 www.tangshuang.net 获取更多精彩内容】未经授权,禁止复制转载。需要写一个directive,使用 te【本文首发于唐霜的博客】转载请注明出处:www.tangshuang.netmplate() 函数来动态返回模板,返【访问 www.tangshuang.net 获取更多精彩内容】【作者:唐霜】回的模板是字符串,于是可以各种骚操作修改著作权归作者所有,禁止商业用途转载。【版权所有,侵权必究】字符串来控制html结构,这比vue、r原创内容,盗版必究。【转载请注明来源】eact的结构编程快上10倍不止。接下来【原创内容,转载请注明出处】【关注微信公众号:wwwtangshuangnet】是对DOM的重新调整,当按照模板结构和样原创内容,盗版必究。原创内容,盗版必究。式完成渲染之后,你可能还需要调整列宽度、【本文受版权保护】未经授权,禁止复制转载。位置、滚动条是否显示、左右两边每行的点击【作者:唐霜】【本文受版权保护】联动、左右都可滚动(pointer-ev转载请注明出处:www.tangshuang.net本文作者:唐霜,转载请注明出处。ents: none;)等等操作,在不修【未经授权禁止转载】【转载请注明来源】改任何数据的情况下,瞬间通过DOM操作完著作权归作者所有,禁止商业用途转载。转载请注明出处:www.tangshuang.net成。而如果这些东西依赖virtual d【转载请注明来源】原创内容,盗版必究。om去做,可以说极其麻烦,代码量上翻10转载请注明出处:www.tangshuang.net本文版权归作者所有,未经授权不得转载。倍很正常。
【原创不易,请尊重版权】转载请注明出处:www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】【本文首发于唐霜的博客】除了上述这两个例子外,我在开发中还会碰到【版权所有】唐霜 www.tangshuang.net【本文受版权保护】其他的一些场景,发现有的时候恨angul【未经授权禁止转载】转载请注明出处:www.tangshuang.netar是垃圾,有的时候又觉得它diao。总【版权所有】唐霜 www.tangshuang.net本文作者:唐霜,转载请注明出处。之,在不同的场景下,不同的编程范式所带来【原创内容,转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】的收益是不同的,但是问题点在于,我们无法转载请注明出处:www.tangshuang.net本文作者:唐霜,转载请注明出处。真正的完全在同一套代码中享受不同范式的好【未经授权禁止转载】【本文受版权保护】处。这也是前端框架的一个不足之处吧。
【转载请注明来源】本文作者:唐霜,转载请注明出处。【版权所有】唐霜 www.tangshuang.net
