一种基于react的多条件组合搜索控件的创建方法技术

本发明专利技术公开了一种基于react的多条件组合搜索控件的创建方法，包括以下步骤：(1)使用html代码搭建所需要的搜索框组件，通过css来编写相应的样式；(2)创建一个数组用来存储所有的搜索条件值，初始时置为空，当页面进行刷新时也重置为空；(3)为所述搜索框组件绑定相应的click事件，但并不触发搜索条件；(4)用户对搜索条件进行选择或输入；(5)编写搜索函数；(6)将搜索框组件、事件、函数封装起来，作为一个控件进行使用。采用该方法创建的搜索控件可以实现对搜索结果的精准定位，尤其是针对有大量订单往来的管理系统，可以提高利用效率。

【技术实现步骤摘要】
一种基于react的多条件组合搜索控件的创建方法
本专利技术涉及搜索控件
，具体涉及一种基于react的多条件组合搜索控件的创建方法。
技术介绍
作为一种构建用户界面的工具，毫无疑问React已经是最流行的前端框架之一，它具有很多非常实用而便捷的功能性组件。在实际的开发过程中，搜索控件的使用率是很高的，它需要获取用户输入或选择的数据，将其传送至后台，通过后台数据库的筛选，得到即将展示的搜索结果。无论是交易系统、管理系统，都必不可少的应用到搜索控件，然而React所提供给我们的搜索组件的使用较为单一刻板，并且缺乏多条件组合搜索功能，常常不适用于具体的业务实现，例如进销存系统，它常常需要非常精准甚至苛刻的搜索条件，并且库存量级或者说流水量级越是庞大，搜索条件就越加复杂，否则，很容易出现成千上万条相似的搜索结果。因此，只有一个搜索条件的原生组件，是远远达不到需求方所要求的效果的。
技术实现思路
为了克服上述技术缺陷，本专利技术提供了一种基于react的多条件组合搜索控件的创建方法，采用该方法创建的搜索控件可以实现对搜索结果的精准定位，尤其是针对有大量订单往来的管理系统，可以提高利用效率。本文档来自技高网...

【技术保护点】
1.一种基于react的多条件组合搜索控件的创建方法，其特征在于，包括以下步骤：(1)使用html代码搭建所需要的搜索框组件，通过css来编写相应的样式；(2)创建一个数组用来存储所有的搜索条件值，初始时置为空，当页面进行刷新时也重置为空；(3)为所述搜索框组件绑定相应的click事件，但并不触发搜索条件；(4)用户对搜索条件进行选择或输入，并按下搜索按钮，通过event.targe直接获取用户选择或输入的dom元素，将其装入条件数组中；(5)编写搜索函数，当用户按下搜索按钮时，首先判断搜索条件数组是否为空，目的在于满足后台查询接口有值才传参数的要求，避免误操作，如果数组不为空，便将打包好的数...

【技术特征摘要】
1.一种基于react的多条件组合搜索控件的创建方法，其特征在于，包括以下步骤：(1)使用html代码搭建所需要的搜索框组件，通过css来编写相应的样式；(2)创建一个数组用来存储所有的搜索条件值，初始时置为空，当页面进行刷新时也重置为空；(3)为所述搜索框组件绑定相应的click事件，但并不触发搜索条件；(4)用户对搜索条件进行选择或输入，并按下搜索按钮，通过event.targe直接获取用户选择或输入的dom元...

【专利技术属性】
技术研发人员：胡一枭，
申请(专利权)人：四川长虹电器股份有限公司，
类型：发明
国别省市：四川,51