CN114217877A - Operation processing method, device, equipment and medium based on page interaction component - Google Patents
Operation processing method, device, equipment and medium based on page interaction component Download PDFInfo
- Publication number
- CN114217877A CN114217877A CN202111550466.5A CN202111550466A CN114217877A CN 114217877 A CN114217877 A CN 114217877A CN 202111550466 A CN202111550466 A CN 202111550466A CN 114217877 A CN114217877 A CN 114217877A
- Authority
- CN
- China
- Prior art keywords
- component
- page interaction
- page
- interaction component
- event
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 230000003993 interaction Effects 0.000 title claims abstract description 217
- 238000003672 processing method Methods 0.000 title claims abstract description 19
- 238000012545 processing Methods 0.000 claims abstract description 94
- 238000000034 method Methods 0.000 claims abstract description 64
- 230000015654 memory Effects 0.000 claims abstract description 34
- 238000009877 rendering Methods 0.000 claims abstract description 30
- 238000006243 chemical reaction Methods 0.000 claims abstract description 24
- 238000012216 screening Methods 0.000 claims description 20
- 238000004891 communication Methods 0.000 claims description 11
- 230000008569 process Effects 0.000 claims description 11
- 230000004044 response Effects 0.000 claims description 6
- 238000004806 packaging method and process Methods 0.000 claims description 5
- 238000011423 initialization method Methods 0.000 claims description 4
- 238000010586 diagram Methods 0.000 description 12
- 230000006870 function Effects 0.000 description 8
- 238000004590 computer program Methods 0.000 description 7
- 238000012986 modification Methods 0.000 description 5
- 230000004048 modification Effects 0.000 description 5
- 238000011161 development Methods 0.000 description 4
- 238000001914 filtration Methods 0.000 description 4
- 239000000243 solution Substances 0.000 description 4
- 230000000694 effects Effects 0.000 description 3
- 230000000903 blocking effect Effects 0.000 description 2
- 230000008859 change Effects 0.000 description 2
- 238000013461 design Methods 0.000 description 2
- 238000002347 injection Methods 0.000 description 2
- 239000007924 injection Substances 0.000 description 2
- 230000004075 alteration Effects 0.000 description 1
- 230000001413 cellular effect Effects 0.000 description 1
- 230000008676 import Effects 0.000 description 1
- 230000002452 interceptive effect Effects 0.000 description 1
- 238000004519 manufacturing process Methods 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000000750 progressive effect Effects 0.000 description 1
- 239000000126 substance Substances 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
- G06F9/44526—Plug-ins; Add-ons
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The invention discloses an operation processing method, device, equipment and medium based on a page interaction component, wherein the method comprises the following steps: receiving a component operation event, wherein the component operation event is used for indicating that target operation processing indicated by the component operation event is performed on a preset page interaction component in a target page, the page interaction component is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction component supports data conversion processing; and responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component. By adopting the invention, the technical problems of unsmooth rendering, unsmooth pull-down sliding, memory overflow and the like in the existing selection select component pull-down frame can be solved.
Description
Technical Field
The invention relates to the technical field of software development, in particular to an operation processing method, device, equipment and medium based on a page interaction component.
Background
In the field of software development, for a selection component in an Element user interface (Element UI), the common attribute and method of the selection component are currently defined, and a dynamic option (option) is generated; according to the event typed by the user, the data intercommunication between the parent-child components is carried out in a mode of injection in the parent-child components by triggering the exchange event.
However, in practice, it is found that when the amount of data related to the drop-down box of the select component in the conventional Element UI is large, for example, the amount of data reaches the level of ten million, the problems of page rendering blocking, unsmooth drop-down sliding, memory overflow and the like are caused.
Disclosure of Invention
The embodiment of the application provides an operation processing method, device, equipment and medium based on a page interaction component, and solves the technical problems of stagnation of rendering, unsmooth pull-down sliding, memory overflow and the like in the existing selection component pull-down frame.
In one aspect, an embodiment of the present application provides an operation processing method based on a page interaction component, where the method includes:
receiving a component operation event, wherein the component operation event is used for indicating that target operation processing indicated by the component operation event is performed on a preset page interaction component in a target page, the page interaction component is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction component supports data conversion processing;
and responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component.
Optionally, the component operational events include at least one of the following interaction events: the method comprises the following steps of screening operation, single selection operation, check operation and full selection operation of a drop-down box, and further comprises the following steps:
and when the interaction indicated by the component operation event is processed, displaying and prompting the selected option data.
Optionally, the component operation event includes a text box out-of-focus event, and performing, by the page interaction component in response to the component operation event, the target operation process indicated by the component operation event includes:
responding to the text box out-of-focus event, after inputting a fuzzy query condition based on the page interaction component, if the click operation of a hollow area in the target page is detected, emptying the input fuzzy query condition, and restoring the page interaction component to a preset initial state.
Optionally, the method further comprises:
outputting attribute parameters related to the page interaction component, wherein the attribute parameters comprise at least one of the following: option, input value, placeholder, factory default parameter factoryDefault, null value parameter shownnulvallue, and garbage parameter disabled.
Optionally, the method further comprises:
receiving input data of the page interaction component;
and when detecting that the input data of the page interaction component comprises null data, converting the null data into a null character string.
Optionally, before the receiving the component operation event, the method further includes:
defining the functional operation supported by the page interaction component;
rendering the defined page interaction component to the target page by adopting a component packaging mode and applying a mode of combining a drop-down frame based on the virtual frame and the virtual tree;
compiling and defining corresponding operation processing logic for the page interaction component;
performing data structure conversion on input data transmitted into the page interaction component so as to convert the input data into target data required by the page interaction component;
integrating the target data in the page interaction component;
wherein the functional operation comprises at least one of: and the method comprises the steps of screening operation, single selection operation, check operation and full selection operation of a drop-down box.
Optionally, writing and defining corresponding operation processing logic for the page interaction component includes:
defining an input box of the page interaction component supporting screening;
defining an initialization method, and rendering data set in the virtual tree;
defining a screening method supported by the page interaction assembly so as to perform corresponding preset logic processing on the screened data;
defining keyboard input events supported by the page interaction component to obtain latest rendering data;
defining a check box switching event supported by the page interaction component to call a corresponding check operation interaction event;
defining a close tag event supported by the page interaction component to update data related to the page interaction component.
In another aspect, an embodiment of the present application provides an operation processing apparatus based on a page interaction component, where the apparatus includes: receiving module and processing module, wherein:
the receiving module is used for receiving an assembly operation event, the assembly operation event is used for indicating that target operation processing indicated by the assembly operation event is carried out on a preset page interaction assembly in a target page, the page interaction assembly is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction assembly supports data conversion processing;
and the processing module is used for responding to the component operation event and carrying out target operation processing indicated by the component operation event based on the page interaction component.
For the content that is not introduced or not described in the embodiment of the present application, reference may be made to the related descriptions in the foregoing method embodiments, and details are not described here again.
On the other hand, the present application provides a terminal device according to an embodiment of the present application, where the terminal device includes: a processor, a memory, a communication interface, and a bus; the processor, the memory and the communication interface are connected through the bus and complete mutual communication; the memory stores executable program code; the processor executes a program corresponding to the executable program code by reading the executable program code stored in the memory, so as to execute the page interaction component-based operation processing method as described above.
On the other hand, the present application provides a computer-readable storage medium by an embodiment of the present application, where the computer-readable storage medium stores a program, and when the program runs on a terminal device, the method for processing operations based on a page interaction component as described above is executed.
One or more technical solutions provided in the embodiments of the present application have at least the following technical effects or advantages: the method comprises the steps of receiving an assembly operation event, wherein the assembly operation event is used for indicating that target operation processing indicated by the assembly operation event is carried out on a preset page interaction assembly in a target page, the page interaction assembly is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction assembly supports data conversion processing; and responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component. In the scheme, the page interaction assembly is rendered into the target page in a mode of combining the drop-down frame based on the virtual frame and the virtual tree, so that the problems that the existing select assembly drop-down frame is blocked in rendering, unsmooth in drop-down sliding and the like when the data volume is large are solved, and meanwhile, the page interaction assembly supports data conversion processing, so that the technical problem of memory overflow can be solved. In addition, the designed page interaction component can realize the target operation processing of the corresponding component operation event, can realize the high multiplexing of the component and improve the user-friendly interaction operation experience.
Drawings
In order to more clearly illustrate the technical solutions in the embodiments of the present invention, the drawings needed to be used in the description of the embodiments are briefly introduced below, and it is obvious that the drawings in the following description are some embodiments of the present invention, and it is obvious for those skilled in the art to obtain other drawings based on the drawings without creative efforts.
Fig. 1 is a schematic flowchart of an operation processing method based on a page interaction component according to an embodiment of the present application.
Fig. 2 is a schematic flowchart of another operation processing method based on a page interaction component according to an embodiment of the present application.
Fig. 3 is a schematic structural diagram of an operation processing apparatus based on a page interaction component according to an embodiment of the present application.
Fig. 4 is a schematic structural diagram of a terminal device according to an embodiment of the present application.
Detailed Description
The embodiment of the application provides an operation processing method based on a page interaction component, and solves the technical problems of unsmooth rendering, unsmooth pull-down sliding, memory overflow and the like in the existing selection select component pull-down frame.
In order to solve the technical problems, the general idea of the embodiment of the application is as follows: receiving a component operation event, wherein the component operation event is used for indicating that target operation processing indicated by the component operation event is performed on a preset page interaction component in a target page, the page interaction component is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction component supports data conversion processing; and responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component.
In order to better understand the technical solution, the technical solution will be described in detail with reference to the drawings and the specific embodiments.
First, it is stated that the term "and/or" appearing herein is merely one type of associative relationship that describes an associated object, meaning that three types of relationships may exist, e.g., a and/or B may mean: a exists alone, A and B exist simultaneously, and B exists alone. In addition, the character "/" herein generally indicates that the former and latter related objects are in an "or" relationship.
First, some technical terms related to the present application are introduced.
A pull-down frame: the select element is a form control, the < select > tab is used to create a drop down list, and the < option > tab represents each item (entry) in the drop down list. Only one option is displayed in a default state, all options can be seen only after a pull-down button is clicked, and a single-choice or multi-choice menu can be created.
An interaction component: definitions are components that receive user input (e.g., keyboard or mouse activity) that can encapsulate data and methods to implement some new functionality. The components have their own properties and methods. An attribute is a simple visitor to component data. The method is some simple and visible function of the component.
Vue: is a set of progressive framework for constructing a user interface. Vue only focus on the viewing layer, with designs developed in bottom-up increments. Vue is to implement the data binding and combined view components of the response through as simple an interface (API) as possible.
Element UI is a set of component library which is realized by adopting Vue 2.0.0 as a basic framework, and a set of component library which is prepared for developers, designers and product managers and is based on Vue 2.0.0, so that matched design resources are provided, and rapid forming of websites is facilitated.
The applicant has also found in the course of the present application that: at present, for a selection component in the Element UI, common attributes and methods are defined, and a dynamic option is generated; according to the user input event, data communication among the components is carried out in a mode of injection in parent-child components by triggering change exchange events; common methods such as selected events, query change events, etc. that are common are handled; the returned data is then updated into the interface.
In practice, it is found that a select drop-down box in the conventional Element UI does not process a large data volume, and when the data volume reaches the level of ten million, the problems of page rendering blocking, unsmooth drop-down sliding, memory overflow and the like are caused. When the data is displayed too long, no more friendly prompt is hovered and displayed.
In order to solve the above problems, the present application provides an operation processing method and apparatus based on a page interaction component, a terminal device, and a medium. Please refer to fig. 1, which is a flowchart illustrating an operation processing method based on a page interaction component according to an embodiment of the present application. The method as shown in fig. 1 is applied to the Vue framework, and comprises the following steps:
s101, receiving an assembly operation event, wherein the assembly operation event is used for indicating that target operation processing indicated by the assembly operation event is carried out on a preset page interaction assembly in a target page, the page interaction assembly is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction assembly supports data conversion processing.
The component operation event is an operation event generated when a user performs operations such as clicking, double clicking, option selection and the like on the page interaction component is detected. The component operation events include, but are not limited to, user typing events, user interaction events, and the like. The user typing event may specifically include a user keyboard event, and the user interaction event may specifically include a filtering operation event, a single-selection operation event, a check operation event, and a full-selection operation event of a drop-down box.
The page interaction component is an interaction component which is configured by a system in a self-definition mode, and can be, for example, the selection component and the like. The page interaction component is rendered into a corresponding target page in advance in a mode of combining a drop-down box (vxe-pulldown) based on a virtual frame and a virtual tree (vxe-virtual-tree), and supports data conversion processing.
S102, responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component.
After receiving the component operation event, the method and the device can respond to and process the component operation event and perform target operation processing indicated by the component operation event based on the page interaction component.
By implementing the method, the device and the system, a component operation event is received, the component operation event is used for indicating that target operation processing indicated by the component operation event is carried out on a preset page interaction component in a target page, the page interaction component is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction component supports data conversion processing; and responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component. In the scheme, the page interaction assembly is rendered into the target page in a mode of combining the drop-down frame based on the virtual frame and the virtual tree, so that the problems that the existing select assembly drop-down frame is blocked in rendering, unsmooth in drop-down sliding and the like when the data volume is large are solved, and meanwhile, the page interaction assembly supports data conversion processing, so that the technical problem of memory overflow can be solved. In addition, the designed page interaction component can realize the target operation processing of the corresponding component operation event, can realize the high multiplexing of the component and improve the user-friendly interaction operation experience.
Please refer to fig. 2, which is a flowchart illustrating another operation processing method based on a page interaction component according to an embodiment of the present application. The method as shown in fig. 2 comprises the following implementation steps:
s201, defining function operations supported by the page interaction assembly; wherein the functional operation comprises at least one of: and the method comprises the steps of screening operation, single selection operation, check operation and full selection operation of a drop-down box.
The basic functions of the page interaction component, such as the functions of drop-down box screening, full selection, half selection and the like, can be defined firstly. Further, the application can define that the common all-selected event method selectAllHandler and the half-selected event method checkedEvent are supported by the page interaction component.
S202, adopting a component packaging mode, and rendering the defined page interaction component into the target page by using a mode of combining a drop-down box (vxe-pulldown) based on the virtual frame and the virtual tree (vxe-virtual-tree).
In a specific embodiment, the present application may define rendering contents in an internal template (template) of an initial rendering, where vxe-pulldown box is cited as an outer box element, and a virtual tree (vxe-virtual-tree) in an internal import table component (vxe-table) is used as a main renderer for page layout. Therefore, the problems that when more data exists in the pull-down frame, the rendering is blocked, the pull-down frame is blocked, and the sliding is not smooth and the like can be solved.
Further the application may define an input box element for filtering and a tag label for closing the option.
S203, writing and defining corresponding operation processing logic for the page interaction assembly.
The method and the device can compile interaction logic of the page interaction component for the page interaction component in the target page. The concrete implementation is as follows:
the method and the device can define an initial input value firstly and set a corresponding default value for an input box. Further, the present application may define an initial init method, which sets an initial value (i.e., rendering data) for data (data) in a virtual number (vxe-virtual-tree) to perform DOM rendering. Next, the present application defines a common screening method, namely, checkedRecords, to unify the logic processing of the screened data, such as the unified processing of null values or null data described in the afternoon. The present application may also define a common user keyboard event keyupEvent to obtain the latest rendering data. The application may also define a common checkbox toggle event selectHandler to be used to update checkbox select events. The application may also define a common close tag event closeTagHandler to be used to update the page interaction component to the latest data related.
S204, carrying out data structure conversion on the input data transmitted into the page interaction assembly so as to convert the input data into target data required by the page interaction assembly, and integrating the target data into the page interaction assembly.
The method and the device can integrate the input data transmitted by the page interaction component into the component after internal unified processing. In specific implementation, the data conversion method transferData can be defined in the tool library, then input data (such as a character string array, an array object and the like) transmitted by the page interaction component is acquired or received, the input data transmitted to the page interaction component is processed, and the input data can be converted into a data structure and the like required by the page interaction component through the transferData, so that corresponding target data is obtained. And finally, integrating the target data into the page interaction assembly again, thereby realizing the data processing inside the assembly.
S205, when detecting that the input data of the page interaction component comprises null data, converting the null data into null character strings.
The application can process default data, null data and null data which are common to the page interaction components, for example, the application can process the data type and whether the data is null data. For example, the application can uniformly convert null data into common uniform processing of character string null, and the like, for input data entering the page interaction component, if the input data includes null data.
S206, receiving and responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component.
The application can process user-entered events and user-interaction events of the component. For example, the application may filter events for user input queries and the processing of text box out of focus events. The method and the device can also carry out interactive processing on single selection operation, check operation and full selection (including whether the selected data is full data or not).
In a specific embodiment, when the component operation event includes an input query screening event of a user, the application responds to the query screening event, and performs screening and display processing and the like on corresponding data or options according to a fuzzy query condition input by the user.
In yet another embodiment, when the component operation event includes a text box out-of-focus event, the application may respond to the text box out-of-focus event, and after the user performs the fuzzy query, if a target operation (e.g., a single click, a double click, a preset line sliding, etc.) for a blank area in the page is detected, the user may clear the fuzzy query condition previously input by the user, and restore the page interaction component to an initial default state, that is, a preset initial state.
In yet another embodiment, when the component operation event includes a user interaction event, for example, an operation event such as a filtering operation, a single selection operation, a check operation, and a full selection operation of a drop-down box, when the application performs a corresponding interaction process in response to the user interaction event, the application may display and prompt option data selected by the user interaction event, for example, display the option data in a tag tips manner, so that hovering display of data can be realized, and a fuzzy and friendly operation experience is enhanced.
And S207, outputting the attribute parameters related to the page interaction assembly. Wherein the attribute parameters include at least one of: option, input value, placeholder, factory default parameter factoryDefault, null value parameter shownnulvallue, and garbage parameter disabled.
The present application may derive user-desired data parameters, which may include, for example and without limitation, any one or combination of more of the following: option, input value, placeholder, factory default parameter factoryDefault, null value parameter shownnulvallue, and garbage parameter disabled.
From the above, the page interaction component provided by the embodiment of the application realizes smooth loading of ten thousand levels of data volume, achieves no pause of one hundred thousand levels of data volume, improves page rendering performance by adopting a virtual form, and improves interaction experience of users. Parameters and methods required by a user are derived in the process of project development, high multiplexing of components is realized, development difficulty and complexity in the stage of project development are reduced, processing of a business logic layer is concerned, and team development is more efficient. The page rendering performance is improved by adopting a virtual loading mode, and the interaction experience of a user is improved. Data hovering display and component switching without pause feeling enhance the user-friendly operation experience.
Based on the same inventive concept, another embodiment of the present application provides a device and a terminal device corresponding to the method for processing operations based on a page interaction component in the embodiment of the present application.
Please refer to fig. 3, which is a schematic structural diagram of an operation processing apparatus based on a page interaction component according to an embodiment of the present application. The apparatus 30 shown in fig. 3 comprises: a receiving module 301 and a processing module 302, wherein:
the receiving module 301 is configured to receive a component operation event, where the component operation event is used to instruct a preset page interaction component in a target page to perform target operation processing indicated by the component operation event, the page interaction component is rendered into the target page in a manner of combining a drop-down box based on a virtual frame and a virtual tree, and the page interaction component supports data conversion processing;
the processing module 302 is configured to, in response to the component operation event, perform target operation processing indicated by the component operation event based on the page interaction component.
Optionally, the component operational events include at least one of the following interaction events: a filtering operation, a single selection operation, a check operation, and a full selection operation of the drop-down box, the processing module 302 is further configured to:
and when the interaction indicated by the component operation event is processed, displaying and prompting the selected option data.
Optionally, the component operation event includes a text box out-of-focus event, and the processing module 302 is specifically configured to:
responding to the text box out-of-focus event, after inputting a fuzzy query condition based on the page interaction component, if the click operation of a hollow area in the target page is detected, emptying the input fuzzy query condition, and restoring the page interaction component to a preset initial state.
Optionally, the processing module 302 is further configured to:
outputting attribute parameters related to the page interaction component, wherein the attribute parameters comprise at least one of the following: option, input value, placeholder, factory default parameter factoryDefault, null value parameter shownnulvallue, and garbage parameter disabled.
Optionally, the processing module 302 is further configured to:
receiving input data of the page interaction component;
and when detecting that the input data of the page interaction component comprises null data, converting the null data into a null character string.
Optionally, before the receiving the component operation event, the processing module 302 is further configured to:
defining the functional operation supported by the page interaction component;
rendering the defined page interaction component to the target page by adopting a component packaging mode and applying a mode of combining a drop-down frame based on the virtual frame and the virtual tree;
compiling and defining corresponding operation processing logic for the page interaction component;
performing data structure conversion on input data transmitted into the page interaction component so as to convert the input data into target data required by the page interaction component;
integrating the target data in the page interaction component;
wherein the functional operation comprises at least one of: and the method comprises the steps of screening operation, single selection operation, check operation and full selection operation of a drop-down box.
Optionally, the processing module 302 is specifically configured to:
defining an input box of the page interaction component supporting screening;
defining an initialization method, and rendering data set in the virtual tree;
defining a screening method supported by the page interaction assembly so as to perform corresponding preset logic processing on the screened data;
defining keyboard input events supported by the page interaction component to obtain latest rendering data;
defining a check box switching event supported by the page interaction component to call a corresponding check operation interaction event;
defining a close tag event supported by the page interaction component to update data related to the page interaction component.
By implementing the method, an assembly operation event is received, the assembly operation event is used for indicating that target operation processing indicated by the assembly operation event is carried out on a preset page interaction assembly in a target page, the page interaction assembly is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction assembly supports data conversion processing; and responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component. In the scheme, the page interaction assembly is rendered into the target page in a mode of combining the drop-down frame based on the virtual frame and the virtual tree, so that the problems that the existing select assembly drop-down frame is blocked in rendering, unsmooth in drop-down sliding and the like when the data volume is large are solved, and meanwhile, the page interaction assembly supports data conversion processing, so that the technical problem of memory overflow can be solved. In addition, the designed page interaction component can realize the target operation processing of the corresponding component operation event, can realize the high multiplexing of the component and improve the user-friendly interaction operation experience.
Please refer to fig. 4, which is a schematic structural diagram of a terminal device according to an embodiment of the present application. The terminal device 40 shown in fig. 4 includes: at least one processor 401, a communication interface 402, a user interface 403 and a memory 404, wherein the processor 401, the communication interface 402, the user interface 403 and the memory 404 may be connected by a bus or other means, and the embodiment of the present invention is exemplified by being connected by a bus 405. Wherein the content of the first and second substances,
The communication interface 402 may be a wired interface (e.g., an ethernet interface) or a wireless interface (e.g., a cellular network interface or using a wireless local area network interface) for communicating with other terminals or websites. In this embodiment of the present invention, the communication interface 402 is specifically configured to receive an operation event and the like.
The user interface 403 may be a touch panel, including a touch screen and a touch screen, for detecting an operation instruction on the touch panel, and the user interface 403 may also be a physical button or a mouse. The user interface 403 may also be a display screen for outputting, displaying images or data.
The Memory 404 may include Volatile Memory (Volatile Memory), such as Random Access Memory (RAM); the Memory may also include a Non-Volatile Memory (Non-Volatile Memory), such as a Read-Only Memory (ROM), a Flash Memory (Flash Memory), a Hard Disk (Hard Disk Drive, HDD), or a Solid-State Drive (SSD); the memory 404 may also comprise a combination of memories of the kind described above. The memory 404 is used for storing a set of program codes, and the processor 401 is used for calling the program codes stored in the memory 404 and executing the following operations:
receiving a component operation event, wherein the component operation event is used for indicating that target operation processing indicated by the component operation event is performed on a preset page interaction component in a target page, the page interaction component is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction component supports data conversion processing;
and responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component.
Optionally, the component operational events include at least one of the following interaction events: a filter operation, a single-selection operation, a check operation, and a full-selection operation of a drop-down box, the processor 401 is further configured to:
and when the interaction indicated by the component operation event is processed, displaying and prompting the selected option data.
Optionally, the component operation event includes a text box out-of-focus event, and performing, by the page interaction component in response to the component operation event, the target operation process indicated by the component operation event includes:
responding to the text box out-of-focus event, after inputting a fuzzy query condition based on the page interaction component, if the click operation of a hollow area in the target page is detected, emptying the input fuzzy query condition, and restoring the page interaction component to a preset initial state.
Optionally, the processor 401 is further configured to:
outputting attribute parameters related to the page interaction component, wherein the attribute parameters comprise at least one of the following: option, input value, placeholder, factory default parameter factoryDefault, null value parameter shownnulvallue, and garbage parameter disabled.
Optionally, the processor 401 is further configured to:
receiving input data of the page interaction component;
and when detecting that the input data of the page interaction component comprises null data, converting the null data into a null character string.
Optionally, before the receiving the component operation event, the method further includes:
defining the functional operation supported by the page interaction component;
rendering the defined page interaction component to the target page by adopting a component packaging mode and applying a mode of combining a drop-down frame based on the virtual frame and the virtual tree;
compiling and defining corresponding operation processing logic for the page interaction component;
performing data structure conversion on input data transmitted into the page interaction component so as to convert the input data into target data required by the page interaction component;
integrating the target data in the page interaction component;
wherein the functional operation comprises at least one of: and the method comprises the steps of screening operation, single selection operation, check operation and full selection operation of a drop-down box.
Optionally, writing and defining corresponding operation processing logic for the page interaction component includes:
defining an input box of the page interaction component supporting screening;
defining an initialization method, and rendering data set in the virtual tree;
defining a screening method supported by the page interaction assembly so as to perform corresponding preset logic processing on the screened data;
defining keyboard input events supported by the page interaction component to obtain latest rendering data;
defining a check box switching event supported by the page interaction component to call a corresponding check operation interaction event;
defining a close tag event supported by the page interaction component to update data related to the page interaction component.
Since the terminal device described in this embodiment is a terminal device used for implementing the operation processing method based on the page interaction component in this embodiment, based on the operation processing method based on the page interaction component described in this embodiment, a person skilled in the art can understand a specific implementation manner of the terminal device of this embodiment and various variations thereof, so that a detailed description of how to implement the method in this embodiment by the terminal device is omitted here. As long as a person skilled in the art implements the terminal device used in the operation processing method based on the page interaction component in the embodiment of the present application, the terminal device is within the scope of the present application.
The technical scheme in the embodiment of the application at least has the following technical effects or advantages: the method comprises the steps of receiving an assembly operation event, wherein the assembly operation event is used for indicating that target operation processing indicated by the assembly operation event is carried out on a preset page interaction assembly in a target page, the page interaction assembly is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction assembly supports data conversion processing; and responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component. In the scheme, the page interaction assembly is rendered into the target page in a mode of combining the drop-down frame based on the virtual frame and the virtual tree, so that the problems that the existing select assembly drop-down frame is blocked in rendering, unsmooth in drop-down sliding and the like when the data volume is large are solved, and meanwhile, the page interaction assembly supports data conversion processing, so that the technical problem of memory overflow can be solved. In addition, the designed page interaction component can realize the target operation processing of the corresponding component operation event, can realize the high multiplexing of the component and improve the user-friendly interaction operation experience.
As will be appreciated by one skilled in the art, embodiments of the present invention may be provided as a method, system, or computer program product. Accordingly, the present invention may take the form of an entirely hardware embodiment, an entirely software embodiment or an embodiment combining software and hardware aspects. Furthermore, the present invention may take the form of a computer program product embodied on one or more computer-usable storage media (including, but not limited to, disk storage, CD-ROM, optical storage, and the like) having computer-usable program code embodied therein.
The present invention is described with reference to flowchart illustrations and/or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of the invention. It will be understood that each flow and/or block of the flow diagrams and/or block diagrams, and combinations of flows and/or blocks in the flow diagrams and/or block diagrams, can be implemented by computer program instructions. These computer program instructions may be provided to a processor of a general purpose computer, special purpose computer, embedded processor, or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable data processing apparatus, create means for implementing the functions specified in the flowchart flow or flows and/or block diagram block or blocks.
These computer program instructions may also be stored in a computer-readable memory that can direct a computer or other programmable data processing apparatus to function in a particular manner, such that the instructions stored in the computer-readable memory produce an article of manufacture including instruction means which implement the function specified in the flowchart flow or flows and/or block diagram block or blocks.
These computer program instructions may also be loaded onto a computer or other programmable data processing apparatus to cause a series of operational steps to be performed on the computer or other programmable apparatus to produce a computer implemented process such that the instructions which execute on the computer or other programmable apparatus provide steps for implementing the functions specified in the flowchart flow or flows and/or block diagram block or blocks.
While preferred embodiments of the present invention have been described, additional variations and modifications in those embodiments may occur to those skilled in the art once they learn of the basic inventive concepts. Therefore, it is intended that the appended claims be interpreted as including preferred embodiments and all such alterations and modifications as fall within the scope of the invention.
It will be apparent to those skilled in the art that various changes and modifications may be made in the present invention without departing from the spirit and scope of the invention. Thus, if such modifications and variations of the present invention fall within the scope of the claims of the present invention and their equivalents, the present invention is also intended to include such modifications and variations.
Claims (10)
1. An operation processing method based on a page interaction component is characterized by comprising the following steps:
receiving a component operation event, wherein the component operation event is used for indicating that target operation processing indicated by the component operation event is performed on a preset page interaction component in a target page, the page interaction component is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction component supports data conversion processing;
and responding to the component operation event, and performing target operation processing indicated by the component operation event based on the page interaction component.
2. The method of claim 1, wherein the component operational events comprise at least one of the following interaction events: the method comprises the following steps of screening operation, single selection operation, check operation and full selection operation of a drop-down box, and further comprises the following steps:
and when the interaction indicated by the component operation event is processed, displaying and prompting the selected option data.
3. The method of claim 1, wherein the component operation event comprises a text box out-of-focus event, and wherein, in response to the component operation event, performing the target operation process indicated by the component operation event based on the page interaction component comprises:
responding to the text box out-of-focus event, after inputting a fuzzy query condition based on the page interaction component, if the click operation of a hollow area in the target page is detected, emptying the input fuzzy query condition, and restoring the page interaction component to a preset initial state.
4. The method of claim 1, further comprising:
outputting attribute parameters related to the page interaction component, wherein the attribute parameters comprise at least one of the following: option, input value, placeholder, factory default parameter factoryDefault, null value parameter shownnulvallue, and garbage parameter disabled.
5. The method of claim 1, further comprising:
receiving input data of the page interaction component;
and when detecting that the input data of the page interaction component comprises null data, converting the null data into a null character string.
6. The method of claim 1, wherein prior to the receiving a component operational event, the method further comprises:
defining the functional operation supported by the page interaction component;
rendering the defined page interaction component to the target page by adopting a component packaging mode and applying a mode of combining a drop-down frame based on the virtual frame and the virtual tree;
compiling and defining corresponding operation processing logic for the page interaction component;
performing data structure conversion on input data transmitted into the page interaction component so as to convert the input data into target data required by the page interaction component;
integrating the target data in the page interaction component;
wherein the functional operation comprises at least one of: and the method comprises the steps of screening operation, single selection operation, check operation and full selection operation of a drop-down box.
7. The method of claim 6, wherein writing and defining corresponding operation processing logic for the page interaction component comprises:
defining an input box of the page interaction component supporting screening;
defining an initialization method, and rendering data set in the virtual tree;
defining a screening method supported by the page interaction assembly so as to perform corresponding preset logic processing on the screened data;
defining keyboard input events supported by the page interaction component to obtain latest rendering data;
defining a check box switching event supported by the page interaction component to call a corresponding check operation interaction event;
defining a close tag event supported by the page interaction component to update data related to the page interaction component.
8. An operation processing apparatus based on a page interaction component, the apparatus comprising: receiving module and processing module, wherein:
the receiving module is used for receiving an assembly operation event, the assembly operation event is used for indicating that target operation processing indicated by the assembly operation event is carried out on a preset page interaction assembly in a target page, the page interaction assembly is rendered into the target page in a mode of combining a drop-down frame based on a virtual frame and a virtual tree, and the page interaction assembly supports data conversion processing;
and the processing module is used for responding to the component operation event and carrying out target operation processing indicated by the component operation event based on the page interaction component.
9. A terminal device, characterized in that the terminal device comprises: a processor, a memory, a communication interface, and a bus; the processor, the memory and the communication interface are connected through the bus and complete mutual communication; the memory stores executable program code; the processor executes a program corresponding to the executable program code by reading the executable program code stored in the memory, for executing the operation processing method of the page interaction component according to any one of claims 1 to 7.
10. A computer-readable storage medium characterized by storing a program which, when run on a terminal device, executes the page interaction component-based operation processing method according to any one of claims 1 to 7.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111550466.5A CN114217877A (en) | 2021-12-17 | 2021-12-17 | Operation processing method, device, equipment and medium based on page interaction component |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111550466.5A CN114217877A (en) | 2021-12-17 | 2021-12-17 | Operation processing method, device, equipment and medium based on page interaction component |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN114217877A true CN114217877A (en) | 2022-03-22 |
Family
ID=80703643
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202111550466.5A Pending CN114217877A (en) | 2021-12-17 | 2021-12-17 | Operation processing method, device, equipment and medium based on page interaction component |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN114217877A (en) |
Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN1480839A (en) * | 2003-08-07 | 2004-03-10 | 刘自鸿 | In doors integrated motion simulation system based on technique of virtual realty |
| US8489641B1 (en) * | 2010-07-08 | 2013-07-16 | Google Inc. | Displaying layers of search results on a map |
| US20130346394A1 (en) * | 2012-06-20 | 2013-12-26 | Schlumberger Technology Corporation | Virtual tree |
| JP2015076064A (en) * | 2013-10-11 | 2015-04-20 | キヤノンマーケティングジャパン株式会社 | Information processing device, information processing method, program, and storage medium |
| CN108984714A (en) * | 2018-07-09 | 2018-12-11 | 北京三快在线科技有限公司 | Page rendering method, apparatus, electronic equipment and computer-readable medium |
| CN111639287A (en) * | 2020-04-29 | 2020-09-08 | 深圳壹账通智能科技有限公司 | Page processing method and device, terminal equipment and readable storage medium |
| CN111984829A (en) * | 2020-07-08 | 2020-11-24 | 福建亿能达信息技术股份有限公司 | Vue-based tree asynchronous loading method, device, equipment and medium |
| CN112632933A (en) * | 2020-12-07 | 2021-04-09 | 平安国际智慧城市科技股份有限公司 | Method and device for quickly making Excel file and storage medium |
-
2021
- 2021-12-17 CN CN202111550466.5A patent/CN114217877A/en active Pending
Patent Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN1480839A (en) * | 2003-08-07 | 2004-03-10 | 刘自鸿 | In doors integrated motion simulation system based on technique of virtual realty |
| US8489641B1 (en) * | 2010-07-08 | 2013-07-16 | Google Inc. | Displaying layers of search results on a map |
| US20130346394A1 (en) * | 2012-06-20 | 2013-12-26 | Schlumberger Technology Corporation | Virtual tree |
| JP2015076064A (en) * | 2013-10-11 | 2015-04-20 | キヤノンマーケティングジャパン株式会社 | Information processing device, information processing method, program, and storage medium |
| CN108984714A (en) * | 2018-07-09 | 2018-12-11 | 北京三快在线科技有限公司 | Page rendering method, apparatus, electronic equipment and computer-readable medium |
| CN111639287A (en) * | 2020-04-29 | 2020-09-08 | 深圳壹账通智能科技有限公司 | Page processing method and device, terminal equipment and readable storage medium |
| CN111984829A (en) * | 2020-07-08 | 2020-11-24 | 福建亿能达信息技术股份有限公司 | Vue-based tree asynchronous loading method, device, equipment and medium |
| CN112632933A (en) * | 2020-12-07 | 2021-04-09 | 平安国际智慧城市科技股份有限公司 | Method and device for quickly making Excel file and storage medium |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US20150293764A1 (en) | Method and system to compose and execute business rules | |
| US8839192B2 (en) | System and method for presentation of cross organizational applications | |
| CN106354483B (en) | Data processing method and device and electronic equipment | |
| WO2013109858A1 (en) | Design canvas | |
| CN104823158A (en) | Method and system for simplified knowledge engineering | |
| CN114064024A (en) | Method, apparatus, device, storage medium, and program product for developing micro-application | |
| KR20110099158A (en) | Content sharing system | |
| CN112631591A (en) | Table element linkage method, device, equipment and computer readable storage medium | |
| CN115599363A (en) | Configuration method, device and system of visual component | |
| WO2024066825A1 (en) | Page project development method, apparatus, device, medium and product | |
| Khan et al. | A retargetable model-driven framework for the development of mobile user interfaces | |
| CN114217877A (en) | Operation processing method, device, equipment and medium based on page interaction component | |
| CN114296845A (en) | Interface processing method, device, electronic device and storage medium | |
| CN111124386B (en) | Animation event processing method, device, equipment and storage medium based on Unity | |
| WO2013002912A1 (en) | Creating logic using pre-built controls | |
| CN111399836A (en) | Method and device for modifying page attribute | |
| CN115248891A (en) | Page display method and device, electronic equipment and storage medium | |
| CN111857715A (en) | H5-based linkage pull-down component selection method, device, equipment and storage medium | |
| CN117215543B (en) | Component development method suitable for different service scene types and corresponding system thereof | |
| CN116595284B (en) | Webpage system operation method, device, equipment, storage medium and program | |
| CN114579031B (en) | Response method and device for sliding operation, server and storage medium | |
| US20170068523A1 (en) | Modular Computer Application Development and Usage | |
| CN117290036A (en) | Window view switching method and device of quantum EDA online tool platform | |
| CN116795360A (en) | Page rendering method, device and equipment | |
| CN115509530A (en) | Recommendation generation method and device and computer readable storage medium |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination |