pomelott

项目目的:

1. 配合本地完成app资源本地化(后面文章会详细说明)

2. 新题型发布无需app本地发版

3. 统一数据源

4. 前端组件的高维护性、高复用性、高可读性

5  更换技术栈:vue全家桶

 

项目技术栈:

根据公司前端工程化定制的 sublime IDE(webpack,svn,secure CRT)、vue全家桶

 

架构:

1、 视图层

2.数据层

3.关键点与创新

(1)在保证高可复用性的基础上做到每个题型组件的流程独立

利用vuex数据共享的高效率优势,降低组件间数据通信的耦合度,提高组件复用率。尽可能分离业务组件与基础组件。降低复用成本与冗余代码。

(2)将vuex数据层与题型配置文件结合成最终的渲染函数,数据是死的,但是配置是可手动配置的,是灵活的,在组件渲染之前动态生成渲染函数生成相应的组件id。增加了整个业务流程的灵活性,而且能够做到配置文件的配置即生效。

(3)增加可选配置,在基础配置无法满足的情况下,可以跨配置进行调度。可以兼容旧版本的数据,大大提高了灵活性(被旧版本的数据兼容逼出来的想法)。

(4)增加 数据无对应配置情况下的 空组件,用以对用户做 空组件提示,在数据版本更高的情况下,提高了业务流程的完整性,增加了容错机制。

(5)利用vue的混入,在h5与app本地交互时,将要求单次调用的方法都注入至事件池中,在单次调用的方法中遍历事件池中的方法,依次执行。避免了对单次调用的方法进行覆盖。

相关文章: