Skip to content

Commit c10c1f8

Browse files
committed
fix writting error
1 parent 96a37a7 commit c10c1f8

File tree

1 file changed

+1
-73
lines changed

1 file changed

+1
-73
lines changed

docs/index.md

+1-73
Original file line numberDiff line numberDiff line change
@@ -463,79 +463,7 @@
463463
const view = new View(doc.querySelector('#mvp-dispatch-view'))
464464
const controller = new Controller(view, model)
465465
controller.init()
466-
})(window, document) !(function(win, doc) {
467-
class Observer {
468-
constructor() {
469-
this.observers = []
470-
}
471-
register(callback) {
472-
this.observers.push(callback)
473-
}
474-
notify(args) {
475-
for (let i = 0, l = this.observers.length; i < l; i++) {
476-
this.observers[i](args)
477-
}
478-
}
479-
}
480-
// View
481-
class View {
482-
constructor($el, tpl) {
483-
this.$el = $el
484-
this.tpl = tpl
485-
this.onAdd = new Observer(this)
486-
this.onChange = new Observer(this)
487-
}
488-
render(data) {
489-
this.$el.innerHTML = this.compile(data)
490-
}
491-
compile(data) {
492-
return this.tpl || `<div><b>${data.name}</b>
493-
<em>${data.num}</em></div>`
494-
}
495-
}
496-
// Model
497-
class Model {
498-
constructor() {
499-
this.data = { name: 'MVP+Dispatch', num: 1 }
500-
this.onUpdate = new Observer(this)
501-
this.onChange = new Observer(this)
502-
}
503-
update(value) {
504-
const fn = (res) => {
505-
this.data.num += value
506-
this.onUpdate.notify(value)
507-
}
508-
fetch('./').then(fn).catch(fn)
509-
}
510-
change(name) {
511-
this.data.name = name
512-
this.onChange.notify(name)
513-
}
514-
}
515-
// Controller
516-
class Controller {
517-
constructor(view, model) {
518-
this.view = view
519-
this.model = model
520-
}
521-
init() {
522-
this.view.$el.addEventListener('click', evt => this.view.onAdd.notify(1))
523-
this.view.$el.addEventListener('mouseout', evt => this.view.onChange.notify('Click to add'))
524-
this.view.onAdd.register(value => {
525-
this.model.data.name = 'Click to add:Event dispatch.'
526-
this.model.update(value)
527-
})
528-
this.view.onChange.register(name => this.model.change(name))
529-
this.model.onUpdate.register(value => this.view.render(this.model.data))
530-
this.model.onChange.register(name => this.view.render(this.model.data))
531-
this.view.render(this.model.data)
532-
}
533-
}
534-
const model = new Model()
535-
const view = new View(doc.querySelector('#mvp-dispatch-view'))
536-
const controller = new Controller(view, model)
537-
controller.init()
538-
})(window, document)v
466+
})
539467
```
540468

541469
### 6. 前端MVVM模式,通过观察者模式将数据与视图进行双向绑定,然后由数据驱动更改

0 commit comments

Comments
 (0)