何为【四更】？
如何实现【四更】？
从架构层面思考项目：目录结构，构建工具，单元测试，组件化开发，抽象需求。
拿开发一个管理端来说
首先配置一个 httpClient 用来管理所有网络请求，包含各种状态的提示（加载中，成功提示，失败提示，服务器异常，服务器维护），缓存管理，授权拦截，response 格式化，让业务层尽可能轻松愉快的请求数据，处理数据。
然后搭建菜单导航配置，充分复用单页应用的路由配置，实现菜单跟着路由走，你添加了几个页面，我就生成几个菜单。同时支持个性化配置，如权限配置（对不同用户展示不同的菜单），层级配置，图标配置
再针对管理端的常见套路（增删改查）来抽象出一套完备的组件。
增改
新增和修改，这两个常见的管理端需求完全可以合并成一个 Modify 组件，实现你写完增组件，就等于写好了改组件，只需要配置两者之间的差异部分，尽可能地复用能够最大限度的减少出错和提高效率。
Modify 组件要能够保罗万象，也就是尽可能地支持后端需要的各种数据，如文本，富文本，时间选择器，下拉选项，手机号+验证码，图片（单张，多张，预览），文件等，同时又可以保证在开发体验上这些不同的类型数据能够“一视同仁”，抽象化成各种表单组件，拿过来简单配置一下就可以用。
同时要有完备的校验系统，要实现能够简单优雅地支持以上所有表单组件。
这里可以就抽象度来举个例子，比如你在使用原生 Form 提交内容的时候，像文本，多选单选等表单基本只需要简单配置一下 name 属性就可以做到拿来就用。而我们的这个 Modify 组件你可以参考原生 Form 的行为把他封装成一个高级版的 Form，通过与子组件约定的“通讯方式”来统管提交过程。而富文本，时间选择器，图片上传等这些个性化的表单，你可以封装成一个个高级版本的 Form 表单。比如图片上传，原生的方式是 file input，但很丑，而且不支持预览，那你在封装的时候就把它想象成一个可以支持图片预览功能的 file input，也就比它要再多配置一个上传路径而已。当上传的时候，Modify 组件发出“通知”，首先触发校验，然后各个表单组件收到命令开始执行各自的个性化操作，最后得到一个完整的待提交内容由 Modify 执行提交，提交完毕之后还能执行一些你配置的命令，如：刷新页面，提示弹窗等等
再说修改，这个可以优化到吹毛求疵的地步。
首先是不允许多次提交。Modify 组件自维护一个提交状态，能够绝对保证用户不能多次触发同一个提交请求
接着是修改前的内容对比。diff 出最小粒度的变更，甚至要实现 diff 某个数组只是数组数据的顺序变了，但内容没变，那可以选择忽略此变更。也就是说要实现尽可能地不提交修改，一旦提交只提交真正变更的部分。
然后说提交过程。这一步重点要说说图片等资源文件的提交。很多管理端都是选择完文件，就立刻执行上传，这一点也不科学！在用户体验上会增加等待时间，还给后端或静态资源服务器增加了压力，以及资源的严重浪费。科学的做法应该是在本地执行完一系列校验之后，真正要提交的时候再去上传图片（这里还有一个优化点是通过 base64 对比来实现如果之前已经上传过该图片，那就直接返回图片地址，又可以减少一次大请求）。同时这个上传也不需要开发者手动去一个个调用，而是 Modify 组件自触发的，要不然用户体验上去了，开发体验差了不是？
最后是修改成功后的内容变更。这个很多管理端的做法是修改完就直接调用页面刷新，确实方便了，但这一点也不酷（不针对某些一定需要刷新页面的需求）。最佳的做法是直接用上一步的 diff 结果在本地更新你的数据，这不仅能实现更低的请求，还能实现更多的事情（如变更数据的热提示）
查询
该功能要能够一定程度上的复用增改的表单组件，增改完之后要根据哪些字段查哪些数据，只要把对应字段的增改组件拿过来稍作修改就可以变成“查组件”，你只需要做这一步，剩下的事情交给管理端的路由去做，它能够动态根据“查组件”去修改页面请求的查询参数，也能根据查询参数去反填充“查组件”，原则是 **”尽可能地将页面的状态映射在 URL 中”**，这么做的好处是用户可以方便地将当前页面连同状态给分享出去。
这里，你应当实现一个响应页面 Query 变化的回调（类似于 Vue 的生命周期函数，建议通过组件级的 Mixin 来实现，同时要考虑到 keepAlive 页面的情况防止误触发）和一个能够方便同步页面 Data 和 Query 的方法（修改任何一方，另一方会同步变化，当然该方法还会涉及到很多诸如类型转化，其它 Query 字段是否保留，自触发过滤等细节问题）。之后类似于分页，查询这种功能，就可以抽象为修改页面的 Query，然后在该回调中直接利用回调的 Query 参数去获取数据即可。不过值得注意的是，如果你的页面有多个查询业务，比如某页面既有用户查询，又有产品查询，那用户的查询参数变更显然不应该触发产品查询，解决办法是可以给回调增加一个 QueryDiff 参数，各个查询在发起请求之前都先判断是否自己的 Query 字段是否在 QueryDiff 中
