const model={const data:{数据},create:{},delete:{},updata(data):{object.assign(新数据,旧数据)//用新数据替换旧数据eventBus.trigger('新数据')//eventBus触发"新数据信息",通知view刷新页面},getdata:{数据a}}
const v={el:要刷新的元素html:`这里是HTML或者其他需要添加进去的元素`,init(container)v.el=$(conrainer)},render(n){刷新页面}}
const c = {init(container) {v.init()//初始化Viewv.render()//第一次渲染页面c.autoBindEvents()//自动的事件绑定eventBus.on('m:update',()=>{v.render()}//当enentsBus触发'm:update'是View刷新},events: {事件 }, //事件以哈希表的方式记录存储add() {+具体实现},minus() {-具体实现},mul() {*具体实现},div() {/具体实现},autoBindEvents() {自动绑定事件}}
像一个触发器的概念
一个开 EventBus.on
一个关 EventBus.off
一个监听 EventBus.trrger
利用继承,在需要知道是否被触发,触发了要做什么,是一个可以全局都用的一个方式,可以重写覆盖相关事件处理
events: {'click #add1' : 'add','click #minus1' : 'minus','click #mul2' : 'mul','click #divide2' : 'div'},add() {m.update( data: {n: m.data.n +1})},minus() {m.update( data: {n: m.data.n -1})},mul() {m.update( data: {n: m.data.n *2})},div() {m.update( data: {n: m.data.n /2})}
1,方便代码维护,升级,互不干扰
2,更好合作
3,要注意命名,在导入的时候,不要重复而冲突
4.’.mjs.js’会比较好,
网速不可控在加载前的用户体验感的优化
1,加一个动画,加载完毕用JS删掉它
加一个骨架
加占位内容
2,在服务器端渲染计数。SSR
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号