一种用户界面的渲染方法及装置.pdf

(19)中华人民共和国国家知识产权局(12)发明专利申请(10)申请公布号CN114153543A(43)申请公布日2022.03.08(21)申请号202111467364.7(22)申请日2021.12.03(71)申请人珠海格力电器股份有限公司地址519070广东省珠海市前山金鸡西路申请人珠海联云科技有限公司(72)发明人王灿良张军黄子勋宋德超张昌文(74)专利代理机构北京华夏泰和知识产权代理有限公司11662代理人蔡良伟(51)Int.Cl.G06F9/451(2018.01)G06F8/38(2018.01)权利要求书2页说明书6页附图3页(54)发明名称一种用户界面的渲染方法及装置(57)摘要本申请提供了一种用户界面的渲染方法及装置，其中，该方法包括：基于JS对象简谱配置一个或多个根节点的数据域；从一个或多个根节点的数据域中确定与目标变量对应的目标根节点，其中，目标根节点的目标数据域中的对象与目标变量对应；在目标根节点的路径信息与组件池中的组件检测信息匹配成功的情况下，基于与组件检测信息对应的组件对目标根节点进行渲染得到用户界面中的功能组件。通过本申请，解决了现有技术中前端用户界面开发复杂的技术问题。CN114153543ACN114153543A权利要求书1/2页1.一种用户界面的渲染方法，其特征在于，包括：基于JS对象简谱配置一个或多个根节点的数据域；其中，所述数据域用于表征所述用户界面的功能集合，所述数据域包括一个或多个数组，所述数据包括一个或多个对象；从所述一个或多个根节点的数据域中确定与目标变量对应的目标根节点，其中，所述目标根节点的目标数据域中的对象与所述目标变量对应；在所述目标根节点的路径信息与组件池中的组件检测信息匹配成功的情况下，基于与所述组件检测信息对应的组件对所述目标根节点进行渲染得到所述用户界面中的功能组件。2.根据权利要求1所述的方法，其特征在于，所述从所述一个或多个根节点的数据域中确定与目标变量对应的根节点，包括：确定当前数据域是否存在与所述目标变量对应的对象；在所述当前数据域存在与所述目标变量对应的对象的情况下，基于数据映射的方式获取与所述目标变量对应的对象；在所述当前数据域不存在与所述目标变量对应的对象的情况下，向所述当前数据域的根节点的数据域中查找与所述目标变量对应的对象。3.根据权利要求1所述的方法，其特征在于，基于与所述组件检测信息对应的组件对所述目标根节点进行渲染得到所述用户界面中的功能组件包括：在与所述组件检测信息对应的组件为容器组件的情况下，基于所述根节点的数据域的属性中render函数进行渲染；其中，所述render函数用于匹配所述根节点的子节点的路径信息与对应的组件。4.根据权利要求1所述的方法，其特征在于，所述基于JS对象简谱配置一个或多个根节点的数据域包括：在Web端客户端基于JS对象简谱配置一个或多个根节点的数据域。5.根据权利要求1所述的方法，其特征在于，在基于与所述组件检测信息对应的组件对所述目标根节点进行渲染得到所述用户界面中的功能组件之后，所述方法还包括：将所述目标根节点中未匹配的属性作为其他组件的Props，其中，所述Props子组件访问父组件数据的接口。6.一种用户界面的渲染装置，其特征在于，包括：配置模块，用于基于JS对象简谱配置一个或多个根节点的数据域；其中，所述数据域用于表征所述用户界面的功能集合，所述数据域包括一个或多个数组，所述数据包括一个或多个对象；确定模块，用于从所述一个或多个根节点的数据域中确定与目标变量对应的目标根节点，其中，所述目标根节点的目标数据域中的对象与所述目标变量对应；渲染模块，用于在所述目标根节点的路径信息与组件池中的组件检测信息匹配成功的情况下，基于与所述组件检测信息对应的组件对所述目标根节点进行渲染得到所述用户界面中的功能组件。7.根据权利要求6所述的装置，其特征在于，所述确定模块包括：确定单元，用于确定当前数据域是否存在与所述目标变量对应的对象；获取单元，用于在所述当前数据域存在与所述目标变量对应的对象的情况下，基于数2CN114153543A权利要求书2/2页据映射的方式获取与所述目标变量对应的对象；查找单元，用于在所述当前数据域不存在与所述目标变量对应的对象的情况下，向所述当前数据域的根节点的数据域中查找与所述目标变量对应的对象。8.根据权利要求6所述的装置，其特征在于，所述渲染模块包括：渲染单元，用于在与所述组件检测信息对应的组件为容器组件的情况下，基于所述根节点的数据域的属性中render函数进行渲染；其中，所述render函数用于匹配所述根节点的子节点的路径信息与对应的组件。9.一种电子设备，其特征在于，包括处理器、通信接口、存储器和通信总线，其中，处理器，通信接口，存储器通过通信总线完成相互间的通信；存