[发明专利]用户界面的组件生成方法及装置

权利要求书

1.一种用户界面的组件生成方法，其特征在于，包括：

监听对组件库中的自定义组件的调用事件；所述自定义组件包括视图层和逻辑层；所述视图层包括至少一个页面元素，所述视图层的页面元素的文档标识与所述逻辑层处理的数据的文档标识绑定；其中，所述逻辑层是处理视图层中的原子组件的逻辑，且所述逻辑层由JavaScript编写；

接收调用组件请求；所述调用组件请求包括待调用组件；

从所述组件库中调用所述待调用组件，显示所述待调用组件的视图层；

通过所述待调用组件的视图层监听页面属性设置事件，并将所述页面属性设置事件反馈给所述待调用组件的逻辑层，以使所述待调用组件的逻辑层根据所述页面属性设置事件修改所述逻辑层的数据；

通过所述待调用组件的视图层并根据文档标识的绑定关系将所述待调用组件的逻辑层中修改后的数据渲染在所述待调用组件的视图层中，完成所述待调用组件的调用；

其中，所述待调用组件包括选择搜索框组件；所述选择搜索框组件的页面元素包括输入框和下拉选择框；

则所述通过所述待调用组件的视图层监听页面属性设置事件，并将所述页面属性设置事件反馈给所述待调用组件的逻辑层，以使所述待调用组件的逻辑层根据所述页面属性设置事件修改所述逻辑层的数据，具体包括：

当通过所述选择搜索框组件的视图层监听到前端搜索设置请求时，通过所述选择搜索框组件的视图层接收搜索数据文件；所述搜索数据文件包括至少一个选项；

通过所述选择搜索框组件的逻辑层将所述搜索数据文件输入所述选择搜索框组件的逻辑层的前端搜索函数中；其中，所述前端搜索函数用于在从所述输入框中接收到关键词时，从所述搜索数据文件中搜索出与所述关键词相关的选项；

所述通过所述待调用组件的视图层监听页面属性设置事件，并将所述页面属性设置事件反馈给所述待调用组件的逻辑层，以使所述待调用组件的逻辑层根据所述页面属性设置事件修改所述逻辑层的数据，还包括：

当通过所述选择搜索框组件的视图层监听到后端搜索设置请求时，通过所述选择搜索框组件的视图层接收后端接口地址；

通过所述选择搜索框组件的逻辑层将所述后端接口地址输入所述选择搜索框组件的逻辑层的后端搜索函数中；其中，所述后端搜索函数用于在所述输入框中接收到关键词时，通过所述后端接口地址将所述关键词提供给后端接口搜索出与所述关键词相关的选项，并接收从所述后端接口返回的选项；

当通过所述选择搜索框组件的视图层监听到选项显示设置请求时，通过所述选择搜索框组件的逻辑层根据选项显示设置请求设置选项显示函数；其中，所述选项显示函数用于将所述前端搜索函数或所述后端搜索函数返回的选项显示于所述视图层，并控制所述选项的显示属性；所述选项显示设置请求包括单选设置请求、多选设置请求和多选样式展示设置请求。

2.如权利要求1所述的用户界面的组件生成方法，其特征在于，所述待调用组件包括日期时间选择器组件；所述日期时间选择器组件的页面元素包括输入框、下拉日历和下拉时间表；所述日期时间选择器组件的逻辑层用于响应下拉日历或下拉时间表上的点击事件，将与所述点击事件对应的日期或时间显示于所述输入框。

3.如权利要求1所述的用户界面的组件生成方法，其特征在于，所述待调用组件包括树组件；所述树组件的页面元素包括输入框、节点和所述节点勾选框；

当通过所述树组件的视图层监听到节点数据加载请求时，通过所述树组件的视图层接收节点数据传送至所述树组件的逻辑层；所述节点数据包括每个节点的名称、从属关系或是否允许勾选的属性；

通过所述树组件的逻辑层对所述节点数据进行遍历，生成所述节点数据的树结构数据，以供所述树组件的视图层根据所述树结构数据进行显示；其中，所述输入框用于从所述输入框中接收到关键词时，提供所述关键词给所述树组件的逻辑层根据所述关键词对所述树结构数据进行遍历节点和在所述树结构数据中设置与所述关键词具有主从关系的节点关联显示标识；所述显示标识用于提供给所述树组件的视图层根据所述显示标识显示与所述显示标识关联的节点。