js数据模型驱动器

广告位招租
扫码页面底部二维码联系

在一次表单重构中,我逐渐意识到,在数据和UI分开的前端开发模式中,UI和数据越来越需要解耦,UI要完完全全和数据本身无关,做到无状态,做到完全靠数据驱动,并且提供响应接口(更新UI的接口)。而数据层面,如果考虑到自身将被用于渲染,那么就要配置一个驱动器,将原始的数据结构转化为便于UI使用的数据结构,这就是独立于UI的数据模型驱动器。

拿表单来说,市面上有一些基于jquery的表单框架,虽然说是框架,实际上,还是一套基于js配置的ui组件,并非真正意义上的框架。而我的思考是,我们同一套表单,它背后的业务逻辑、数据提交的验证、编辑时的数据回溯等等问题,也就是脱离了UI层面的其他逻辑问题,都可以抽象出来。现在的开发全部是多端开发,同一个表单,在UI界面上可能不同,使用的UI技术也可能不同,例如在公众号网页和在小程序中,甚至在ReactNative构建的原生app中,他们抛开UI、交互层面的东西,背后的业务逻辑几乎是一摸一样的,为什么不可以共享?而且这三种场景,背后都支持js原生的计算能力和语言特性,所以,很明显是一定可以共享的,所不同的是,在将模型和UI框架进行拼接时,拼接方式不同。

表单模型只是一个例子。这种将模型抽离出UI的方案,适用于大部分带有业务逻辑的中后台应用中,在都使用了web技术的前提下,想多端共享同一套业务逻辑,就应该用这种思路去写。

现在的问题是,有没有一套完整方案(框架),去像React那样,编写模型。我认为还没有,或者说,还没有一个UI框架是基于这种考虑去实现的,因此,也就没有模型框架可以被应用到实际开发中。如果有一种UI框架(特别是React),可以基于“模型-视图”的方式去开发自己,那么就更有利于模型框架的出现。就目前而言,最接近这种形态的是rxjs作为模型框架,react作为UI框架。