![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
MVVM
2024路在何方
某行业全球top1企业的前端主管
展开
-
【手写】MVVM原理1
刚写的原理,先放上来再说,后续补充解说 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>MVVM</title> </head> <body> &a原创 2019-03-17 21:23:41 · 423 阅读 · 0 评论 -
【手写】MVVM原理2
刚写的原理,先放上来再说,后续补充解说 MVVM.js class MVVM{ constructor(options){ //一上来 先把可用的东西,挂在在实例上 this.$el = options.el; this.$data = options.data; //判断是否存在要编译的模板,如果有,就开始编译 if(this.$el){ //数据劫持 就是...原创 2019-03-17 21:25:41 · 283 阅读 · 0 评论 -
【手写】MVVM原理3
刚写的原理,先放上来再说,后续补充解说 compile.js /* 简单手写一把数据的编译,主要支持: 文本编译 输入框model编译 功能可以扩充,重在编译的思想。 */ class Compile{ constructor(el,vm){ this.el = this.isElementNode(el) ? el : document.querySelector(el...原创 2019-03-17 21:28:03 · 345 阅读 · 0 评论 -
【手写】MVVM原理4
刚写的原理,先放上来再说,后续补充解说 obeserver.js /* 主要是把这个对象变成get和set */ class Observer{ constructor(data){ //专门用于劫持用的 this.observer(data) } observer(data){ //要对这个data数据,将原有的属性改成set和get的形式 //首先,data要...原创 2019-03-17 21:29:21 · 315 阅读 · 0 评论 -
【手写】MVVM原理5
刚写的原理,先放上来再说,后续补充解说 wather.js //观察者的目的就是给需要变化的那个元素增加一个观察者,当数据变化后,执行对应的方法。 //vue的watch方法也是靠这个 //用新值和老值进行比较,如果发生变化,就调用更新方法 //vm.$data expr class Watcher{ constructor(vm,expr,cb){//cb就是更新方法 this...原创 2019-03-17 21:30:52 · 543 阅读 · 0 评论