位置: IT常识 - 正文
推荐整理分享如何理解虚拟DOM(如何理解虚拟存储的虚拟),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:如何理解虚拟变量陷阱,如何理解虚拟变量陷阱,如何理解虚拟实践,如何理解虚拟性的表演,如何理解虚拟资本的概念,如何理解虚拟实践,如何理解虚拟政府模式,如何理解虚拟实践的客观实在性,内容如对您有帮助,希望把文章链接给更多的朋友!
假如现在你需要写一个像下面一样的表格的应用程序,这个表格可以根据不同的字段进行升序或者降序的展示。
这个应用程序看起来很简单,你可以想出好几种不同的方式来写。最容易想到的可能是,在你的 JavaScript 代码里面存储这样的数据:
var sortKey = "new" // 排序的字段,新增(new)、取消(cancel)、净关注(gain)、累积(cumulate)人数var sortType = 1 // 升序还是逆序var data = [{...}, {...}, {..}, ..] // 表格数据用三个字段分别存储当前排序的字段、排序方向、还有表格数据;然后给表格头部加点击事件:当用户点击特定的字段的时候,根据上面几个字段存储的内容来对内容进行排序,然后用 JS 或者 jQuery 操作 DOM,更新页面的排序状态(表头的那几个箭头表示当前排序状态,也需要更新)和表格内容。
这样做会导致的后果就是,随着应用程序越来越复杂,需要在JS里面维护的字段也越来越多,需要监听事件和在事件回调用更新页面的DOM操作也越来越多,应用程序会变得非常难维护。后来人们使用了 MVC、MVP 的架构模式,希望能从代码组织方式来降低维护这种复杂应用程序的难度。但是 MVC 架构没办法减少你所维护的状态,也没有降低状态更新你需要对页面的更新操作(前端来说就是DOM操作),你需要操作的DOM还是需要操作,只是换了个地方。
既然状态改变了要操作相应的DOM元素,为什么不做一个东西可以让视图和状态进行绑定,状态变更了视图自动变更,就不用手动更新页面了。这就是后来人们想出了 MVVM 模式,只要在模版中
上一篇:Java web入门:在Idea上创建Java web项目(java webflux)
下一篇:Vue生命周期,总也学不会,所以我详细整理了一下(vue生命周期分别做了什么)
友情链接: 武汉网站建设