[发明专利]基于json数据构建双向绑定的web页面前端展示方法和系统

权利要求书

1.一种基于json数据构建双向绑定的web页面前端展示方法，其特征在于，包括：

获取web页面各个业务模块的json数据；

将每一个业务模块的json数据处理为键/值形式的数据；

根据业务需求确定键/值形式的数据所对应的键的getter和setter方法；

根据预设字段类型的属性信息确定所要渲染的键的类型；

对json数据进行遍历，根据所要渲染的键的类型确定所要渲染的DOM节点；

将所要渲染的DOM节点进行渲染，组成DOM树；

根据DOM树组成web页面；

获取web页面上DOM节点的点击事件；

通过所述点击事件所对应的json键触发对应的setter方法，改变点击事件所对应的json数据，得到更新的json数据；

根据更新的json数据对web页面进行更新。

2.根据权利要求1所述的基于json数据构建双向绑定的web页面前端展示方法，其特征在于，获取web页面各个业务模块的json数据的步骤中，包括：

获取业务需求；

根据业务需求将web页面划分为不同的业务模块；

根据每一个业务模块得到每一个业务模块所对应的json数据。

3.根据权利要求1所述的基于json数据构建双向绑定的web页面前端展示方法，其特征在于，将每一个业务模块的json数据处理为键/值形式的数据的步骤中，包括：

根据业务场景复杂度确定循环次数；

根据循环次数对每一个业务模块的json数据进行循环处理得到每一个json数据所对应的键/值。

4.根据权利要求1所述的基于json数据构建双向绑定的web页面前端展示方法，其特征在于，根据业务需求确定键/值形式的数据所对应的键的getter和setter方法的步骤中，包括：

根据业务需求确定键/值形式的数据中对象的属性；

若所述对象的属性为可读可写属性，则将对象所对应的键进行getter方法和setter方法的定义；

若所述对象的属性为可读不可写属性，则将对象所对应的键进行getter方法的定义。

5.根据权利要求1-4中任一所述的基于json数据构建双向绑定的web页面前端展示方法，其特征在于，根据更新的json数据对web页面进行更新的步骤之后，还包括：

将更新的json数据进行存储。

6.根据权利要求5所述的基于json数据构建双向绑定的web页面前端展示方法，其特征在于，将更新的json数据进行存储的步骤中，包括：

根据更新的json数据确定更新的json数据所对应的业务模块；

根据更新的json数据所对应的业务模块确定更新的json数据所对应的来源标识；

将更新的json数据按照来源标识存储至后台数据库中。

7.一种基于json数据构建双向绑定的web页面前端展示系统，其特征在于，包括：

第一获取模块，用于获取web页面各个业务模块的json数据；

第一处理模块，用于将每一个业务模块的json数据处理为键/值形式的数据：

第二处理模块，用于根据业务需求确定键/值形式的数据所对应的键的getter和setter方法；

第三处理模块，用于根据预设字段类型的属性信息确定所要渲染的键的类型；

第四处理模块，用于对json数据进行遍历，根据所要渲染的键的类型确定所要渲染的DOM节点；

第五处理模块，用于将所要渲染的DOM节点进行渲染，组成DOM树；

第六处理模块，用于根据DOM树组成web页面；

第二获取模块，用于获取web页面上DOM节点的点击事件；

第七处理模块，用于通过所述点击事件所对应的json键触发对应的setter方法，改变点击事件所对应的json数据，得到更新的json数据；

第八处理模块，用于根据更新的json数据对web页面进行更新。