CN112527258A - Page component development method, system, terminal and computer readable storage medium - Google Patents
Page component development method, system, terminal and computer readable storage mediumDownload PDFInfo
- Publication number
- CN112527258A CN112527258ACN202011489807.8ACN202011489807ACN112527258ACN 112527258 ACN112527258 ACN 112527258ACN 202011489807 ACN202011489807 ACN 202011489807ACN 112527258 ACN112527258 ACN 112527258A
- Authority
- CN
- China
- Prior art keywords
- target data
- target
- data
- page component
- cache memory
- 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
Images
Classifications
- G—PHYSICS
- G06—COMPUTING OR CALCULATING; COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/20—Software design
- G—PHYSICS
- G06—COMPUTING OR CALCULATING; COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/34—Graphical or visual programming
- G—PHYSICS
- G06—COMPUTING OR CALCULATING; COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
Abstract
Translated fromChinese
Description
Technical Field
The present application relates to the field of computer technologies, and in particular, to a method, a system, a terminal, and a computer-readable storage medium for developing a page component.
Background
With the change of network development, various websites and application programs bring great convenience to life and production. The page is used as a medium for interaction between a user and a website and an application program, and the quality of the page often directly influences the use experience of the user, so that the development of the front-end page is an important component of website development and application program development.
The development of a front-end page is generally divided into three parts, namely a page component, data and logic, wherein the page component can be reused, but the data needed to be used by the page component needs to be loaded from a remote server or a local server, and the loading process needs a developer to write related logic codes for requesting data in the page component, so that the developer still needs to write a large amount of codes, and the development efficiency is reduced.
Disclosure of Invention
The application provides a page component development method, a system, a terminal and a computer readable storage medium, which are used for solving the problem of low development efficiency of the existing front-end page component.
In order to solve the technical problem, the application adopts a technical scheme that: a page component development method is provided, which comprises the following steps: acquiring a front-end development requirement; confirming a required target page component and a target data mark of required data based on the front-end development requirement; inquiring a target data source and an acquisition mode corresponding to the target data mark according to a pre-configured configuration file, acquiring target data through the target data source and the acquisition mode, and pre-storing the data source and the acquisition mode corresponding to each data mark by the configuration file; packaging the target data according to a format required by the target page component; and rendering the target page component by using the packaged target data to obtain the target page component with the corresponding function.
As a further improvement of the present application, before querying a target data source and an acquisition manner corresponding to the target data flag according to a pre-configured configuration file, the method further includes: inquiring whether target data exist in a preset first cache memory based on the target data mark; if yes, acquiring target data from the first cache memory; if not, executing the step of inquiring a target data source and an acquisition mode corresponding to the target data mark according to a pre-configured configuration file; after obtaining the target page component with the corresponding function, the method further comprises the following steps: and storing the target data in a first cache memory after the target data corresponds to the target data mark.
As a further improvement of the present application, after storing the target data in the first cache memory after corresponding to the target data flag, the method further includes: and when the storage time of the target data in the first cache memory reaches a first preset time length, deleting the target data from the first cache memory.
As a further improvement of the present application, after storing the target data in the first cache memory after corresponding to the target data flag, the method further includes: acquiring new target data again according to the source and the acquisition mode of the target data every second preset time interval, and comparing the new target data with the target data in the first cache memory; when the target data is modified, synchronizing the new target data into the first cache memory; and re-rendering the target page component according to the new target data.
As a further improvement of the present application, after obtaining the target page component with the corresponding function, the method further includes: detecting whether at least two target page components needing to use common data exist; if so, setting a second cache memory, storing the common data into the second cache memory, and calling the common data from the second cache memory by at least two target page components.
As a further improvement of the present application, the step of obtaining the target data by the target data source and the obtaining manner includes: acquiring initial data by using an acquisition mode based on a target data source; and acquiring a filtering condition, and filtering the initial data based on the filtering condition to obtain target data.
As a further improvement of the present application, after obtaining the target page component with the corresponding function, the method further includes: and uploading the target page component to the block chain.
In order to solve the above technical problem, another technical solution adopted by the present application is: provided is a page component development system including: the first acquisition module is used for acquiring front-end development requirements; the confirmation module is used for confirming the required target page component and the target data mark of the required data based on the front-end development requirement; the second acquisition module is used for inquiring a target data source and an acquisition mode corresponding to the target data mark according to a pre-configured configuration file, acquiring target data through the target data source and the acquisition mode, and pre-storing the data source and the acquisition mode corresponding to each data mark by the configuration file; the packaging module is used for packaging the target data according to a format required by the target page component; and the rendering module is used for rendering the target page component by using the packaged target data to obtain the target page component with the corresponding function.
In order to solve the above technical problem, the present application adopts another technical solution that: there is provided a terminal including: a memory and at least one processor, the memory having instructions stored therein; at least one processor calls instructions in memory to implement the page component development method as any one of above.
In order to solve the above technical problem, the present application adopts another technical solution that: there is provided a computer readable storage medium having stored thereon instructions which, when executed by a processor, implement a page component development method as in any above.
The beneficial effect of this application is: the page component development method of the application sets the configuration file in advance, when a developer carries out front-end development, only the target data mark is required to be transmitted, the configuration file is used for inquiring the target data source and the acquisition mode corresponding to the target data mark, corresponding target data is acquired through the target data source and the acquisition mode, it does not require a developer to write logic requesting target data in the code of each page component, thereby simplifying the codes in the front-end page development process, making the code logic clearer, further improving the efficiency of the front-end page development, and, in the subsequent maintenance process, if the code logic for acquiring the target data changes, only the code logic of the data source and/or the acquisition mode needs to be modified, and the codes in the page components do not need to be modified one by one, so that the maintenance difficulty is reduced.
Drawings
FIG. 1 is a flowchart illustrating a page component development method according to a first embodiment of the present invention;
FIG. 2 is a flowchart illustrating a page component development method according to a second embodiment of the present invention;
FIG. 3 is a flowchart illustrating a page component development method according to a third embodiment of the present invention;
FIG. 4 is a flowchart illustrating a page component development method according to a fourth embodiment of the present invention;
FIG. 5 is a flowchart illustrating a page component development method according to a fifth embodiment of the present invention;
FIG. 6 is a functional module diagram of a page component development system according to an embodiment of the present invention;
fig. 7 is a schematic structural diagram of a terminal according to an embodiment of the present invention;
fig. 8 is a schematic structural diagram of a computer-readable storage medium according to an embodiment of the present invention.
Detailed Description
The technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the drawings in the embodiments of the present application, and it is obvious that the described embodiments are only a part of the embodiments of the present application, and not all of the embodiments. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present application.
The terms "first", "second" and "third" in this application are used for descriptive purposes only and are not to be construed as indicating or implying relative importance or implying any indication of the number of technical features indicated. Thus, a feature defined as "first," "second," or "third" may explicitly or implicitly include at least one of the feature. In the description of the present application, "plurality" means at least two, e.g., two, three, etc., unless explicitly specifically limited otherwise. All directional indications (such as up, down, left, right, front, and rear … …) in the embodiments of the present application are only used to explain the relative positional relationship between the components, the movement, and the like in a specific posture (as shown in the drawings), and if the specific posture is changed, the directional indication is changed accordingly. Furthermore, the terms "include" and "have," as well as any variations thereof, are intended to cover non-exclusive inclusions. For example, a process, method, system, article, or apparatus that comprises a list of steps or elements is not limited to only those steps or elements listed, but may alternatively include other steps or elements not listed, or inherent to such process, method, article, or apparatus.
Reference herein to "an embodiment" means that a particular feature, structure, or characteristic described in connection with the embodiment can be included in at least one embodiment of the application. The appearances of the phrase in various places in the specification are not necessarily all referring to the same embodiment, nor are separate or alternative embodiments mutually exclusive of other embodiments. It is explicitly and implicitly understood by one skilled in the art that the embodiments described herein can be combined with other embodiments.
Fig. 1 is a flowchart illustrating a page component development method according to a first embodiment of the present invention. It should be noted that the method of the present invention is not limited to the flow sequence shown in fig. 1 if the results are substantially the same. As shown in fig. 1, the method comprises the steps of:
step S101: and acquiring the front-end development requirement.
Specifically, the developer can input corresponding front-end development requirements according to the requirements, wherein the front-end development requirements comprise required components, data, events and other information.
Step S102: target page components required and target data tags for required data are identified based on front-end development requirements.
Specifically, the front-end page development framework includes a plurality of page components, where a page component corresponds to a certain visualization object on a page, such as a button, an input box, a drop-down box, a multi-selection box, a radio box, and the like, and the page component is configured to present data obtained from a back end on the page, where the presentation mode may be to directly present content of the data, or to present a certain state of the visualization object determined according to the data. The data flag is a flag of data required for realizing a corresponding function based on a front-end development requirement, for example, when a department needs to be developed to select a drop-down frame component, a target page component required in the front-end development requirement is the drop-down frame page component, and a target data flag of the required data is the department. It should be noted that the correspondence between the data and the data flag is defined in advance by a developer, for example: the data mark corresponding to the department data is a department, and the data mark corresponding to the project group data is a project group name.
Step S103: and inquiring a target data source and an acquisition mode corresponding to the target data mark according to a pre-configured configuration file, acquiring target data through the target data source and the acquisition mode, and pre-storing the data source and the acquisition mode corresponding to each data mark by the configuration file.
Specifically, the configuration file is configured in advance, wherein the corresponding relation between the data mark and the data source and the acquisition mode is stored, the target data source and the acquisition mode corresponding to the target data mark can be obtained through query by the target data mark, and then the target data is acquired according to the target data source and the acquisition mode.
It should be noted that, in order to manage the configuration file conveniently, when the configuration file is preset, the configuration file is divided into modules according to certain characteristic information of the data, and the data in each module has certain identical characteristic information, for example, the characteristic information may be a type of the data or a department corresponding to the data or a source of the data, and through the modularized setting, the target data can be quickly located according to the module division information, so that developers can conveniently manage the configuration file.
Further, the step of obtaining the target data through the target data source and the obtaining manner specifically includes:
1. and acquiring initial data by using an acquisition mode based on a target data source.
Specifically, for example, the target data source is a remote server, and the obtaining manner may be accessing the remote server and downloading the target data from the remote server.
2. And acquiring a filtering condition, and filtering the initial data based on the filtering condition to obtain target data.
Specifically, after the initial data is acquired according to the source and the acquisition mode of the target data, the range of the initial data is too large, wherein the initial data may possibly include data which is not needed by a developer, and the target data is obtained by filtering the acquired initial data by combining the filtering conditions input by the developer. For example, currently, the list data of the second department needs to be acquired, and the acquired initial data includes the list data of all departments, so that the developer needs to input the filtering condition of the second department, and then filter the filtering condition to obtain the list data of the second department.
In the embodiment, after the storage location of the target data is confirmed according to the source of the target data, the initial data is obtained in a corresponding obtaining mode, and then the initial data is filtered by combining the filtering condition input by the developer, so that the required target data is obtained, and the setting of the filtering condition enables the developer to obtain more accurate target data according to the requirement, so that the developer does not need to modify the target data again in the following process, and the requirement of the developer is met more flexibly.
Step S104: and packaging the target data according to the format required by the target page component.
Specifically, after the target data is obtained, the target data needs to be packaged according to a format required by the target page, for example, the target data required by a department to select a drop-down box component needs to be packaged in a list form, and if the drop-down box cannot display all the data, a pull-down bar needs to be set in the drop-down box.
Step S105: and rendering the target page component by using the packaged target data to obtain the target page component with the corresponding function.
Specifically, the target data and the target page component are automatically converted into format data capable of being rendered by the act, so that page rendering is realized by the act, and the target page component with the corresponding function is finally obtained.
In the page component development method according to the first embodiment of the present invention, by setting the configuration file in advance, when the developer performs front-end development, only the target data mark is required to be transmitted, the configuration file is used for inquiring the target data source and the acquisition mode corresponding to the target data mark, corresponding target data is acquired through the target data source and the acquisition mode, it does not require a developer to write logic requesting target data in the code of each page component, thereby simplifying the code developed by the front-end page, making the code logic clearer, further improving the efficiency of the front-end page development, and, in the subsequent maintenance process, if the code logic for acquiring the target data changes, only the code logic of the data source and/or the acquisition mode needs to be modified, and the codes in the page components do not need to be modified one by one, so that the maintenance difficulty is reduced.
Fig. 2 is a flowchart illustrating a page component development method according to a second embodiment of the present invention. It should be noted that the method of the present invention is not limited to the flow sequence shown in fig. 2 if the results are substantially the same. As shown in fig. 2, the method comprises the steps of:
step S201: and acquiring the front-end development requirement.
In this embodiment, step S201 in fig. 2 is similar to step S101 in fig. 1, and for brevity, is not described herein again.
Step S202: target page components required and target data tags for required data are identified based on front-end development requirements.
In this embodiment, step S202 in fig. 2 is similar to step S102 in fig. 1, and for brevity, is not described herein again.
Step S203: and inquiring whether the target data exists from a preset first cache memory based on the target data mark. If yes, go to step S204; if not, go to step S205.
It should be noted that the first cache memory is preset and used for temporarily storing data that needs to be used repeatedly in the front-end page development process, so that the front-end page development process can conveniently and quickly obtain related data, and the development efficiency is improved.
Step S204: target data is retrieved from the first cache memory.
Specifically, if the target data exists in the first cache memory, the target data is directly and quickly acquired from the first cache memory.
Step S205: and inquiring a target data source and an acquisition mode corresponding to the target data mark according to a pre-configured configuration file, acquiring target data through the target data source and the acquisition mode, and pre-storing the data source and the acquisition mode corresponding to each data mark by the configuration file.
In this embodiment, step S205 in fig. 2 is similar to step S103 in fig. 1, and for brevity, is not described herein again.
Step S206: and packaging the target data according to the format required by the target page component.
In this embodiment, step S206 in fig. 2 is similar to step S104 in fig. 1, and for brevity, is not described herein again.
Step S207: and rendering the target page component by using the packaged target data to obtain the target page component with the corresponding function.
In this embodiment, step S207 in fig. 2 is similar to step S105 in fig. 1, and for brevity, is not described herein again.
Further, when the target data is obtained in the manner of step S205, in this embodiment, after step S207, the method further includes:
step S208: and storing the target data in a first cache memory after the target data corresponds to the target data mark.
Specifically, in the front-end page development process, the same target data is often used repeatedly, so that in order to avoid repeatedly performing the step of obtaining the target data described in step S205, the target data may be stored in the first cache memory, and when the target data needs to be used, the target data may be directly obtained from the first cache memory.
On the basis of the first embodiment, the page component development method according to the second embodiment of the present invention queries whether the target data exists in the first cache memory when the target is acquired, and if the target data exists, the target data is directly acquired from the first cache memory, so that code logic of a target data source and an acquisition mode does not need to be executed, and data processing amount is reduced. And when the target data does not exist in the first cache memory, the target data is acquired according to the target data source and the acquisition mode, the target data is stored in the first cache memory after corresponding to the target data mark, and the target data can be directly called when the target data is needed to be used in subsequent development without repeatedly executing the step of acquiring the target data according to the target data source and the acquisition mode, so that the data processing amount is further reduced, and the development efficiency is improved.
Fig. 3 is a flowchart illustrating a page component development method according to a third embodiment of the present invention. It should be noted that the method of the present invention is not limited to the flow sequence shown in fig. 3 if the results are substantially the same. As shown in fig. 3, the method comprises the steps of:
step S301: and acquiring the front-end development requirement.
In this embodiment, step S301 in fig. 3 is similar to step S201 in fig. 2, and for brevity, is not described herein again.
Step S302: target page components required and target data tags for required data are identified based on front-end development requirements.
In this embodiment, step S302 in fig. 3 is similar to step S202 in fig. 2, and for brevity, is not described herein again.
Step S303: and inquiring whether the target data exists from a preset first cache memory based on the target data mark. If yes, go to step S304; if not, step S305 is executed.
In this embodiment, step S303 in fig. 3 is similar to step S203 in fig. 2, and for brevity, is not described herein again.
Step S304: target data is retrieved from the first cache memory.
In this embodiment, step S304 in fig. 3 is similar to step S204 in fig. 2, and for brevity, is not described herein again.
Step S305: and inquiring a target data source and an acquisition mode corresponding to the target data mark according to a pre-configured configuration file, acquiring target data through the target data source and the acquisition mode, and pre-storing the data source and the acquisition mode corresponding to each data mark by the configuration file.
In this embodiment, step S305 in fig. 3 is similar to step S205 in fig. 2, and for brevity, is not described herein again.
Step S306: and packaging the target data according to the format required by the target page component.
In this embodiment, step S306 in fig. 3 is similar to step S206 in fig. 2, and for brevity, is not described herein again.
Step S307: and rendering the target page component by using the packaged target data to obtain the target page component with the corresponding function.
In this embodiment, step S307 in fig. 3 is similar to step S207 in fig. 2, and for brevity, is not described herein again.
When the target data is acquired in the manner of step S305, in this embodiment, after step S307, the method further includes:
step S308: and storing the target data in a first cache memory after the target data corresponds to the target data mark.
In this embodiment, step S308 in fig. 3 is similar to step S208 in fig. 2, and for brevity, is not described herein again.
Step S309: and when the storage time of the target data in the first cache memory reaches a first preset time length, deleting the target data from the first cache memory.
Specifically, a first preset time duration is preset, timing is started when the target data is stored in the first cache memory, and the target data is deleted from the first cache memory when the timing time duration reaches the first preset time duration. It should be noted that the first preset time period is preset, for example, 24 hours. Further, the data in the first cache memory may be set to be cleared once every preset time interval or set to be cleared at regular time, for example, 4 am. In addition, the method can be set to automatically clear the data in the first cache memory when the user stops running the first cache memory.
The page component development method according to the third embodiment of the present invention is based on the second embodiment, by starting timing when target data is stored in the first cache memory, and deleting the target data from the first cache memory when a storage time of the target data in the first cache memory reaches a first preset time, where the first preset time is set according to experience of a developer, and when the first preset time is exceeded, it is indicated that the developer does not need to reuse the target data within a long period of time, and at this time, the target data is deleted from the first cache memory to reduce occupation of storage resources, thereby facilitating storage of other data that needs to be used.
Fig. 4 is a flowchart illustrating a page component development method according to a fourth embodiment of the present invention. It should be noted that the method of the present invention is not limited to the flow sequence shown in fig. 4 if the results are substantially the same. As shown in fig. 4, the method includes the steps of:
step S401: and acquiring the front-end development requirement.
In this embodiment, step S401 in fig. 4 is similar to step S201 in fig. 2, and for brevity, is not described herein again.
Step S402: target page components required and target data tags for required data are identified based on front-end development requirements.
In this embodiment, step S402 in fig. 4 is similar to step S202 in fig. 2, and for brevity, is not described herein again.
Step S403: and inquiring whether the target data exists from a preset first cache memory based on the target data mark. If yes, go to step S404; if not, go to step S405.
In this embodiment, step S403 in fig. 4 is similar to step S203 in fig. 2, and for brevity, is not described herein again.
Step S404: target data is retrieved from the first cache memory.
In this embodiment, step S404 in fig. 4 is similar to step S204 in fig. 2, and for brevity, is not described herein again.
Step S305: and inquiring a target data source and an acquisition mode corresponding to the target data mark according to a pre-configured configuration file, acquiring target data through the target data source and the acquisition mode, and pre-storing the data source and the acquisition mode corresponding to each data mark by the configuration file.
In this embodiment, step S405 in fig. 4 is similar to step S205 in fig. 2, and for brevity, is not described herein again.
Step S306: and packaging the target data according to the format required by the target page component.
In this embodiment, step S406 in fig. 4 is similar to step S206 in fig. 2, and for brevity, is not described herein again.
Step S307: and rendering the target page component by using the packaged target data to obtain the target page component with the corresponding function.
In this embodiment, step S407 in fig. 4 is similar to step S207 in fig. 2, and for brevity, is not described herein again.
When the target data is acquired in the manner of step S405, in this embodiment, after step S407, the method further includes:
step S408: and storing the target data in a first cache memory after the target data corresponds to the target data mark.
In this embodiment, step S408 in fig. 4 is similar to step S208 in fig. 2, and for brevity, is not described herein again.
Step S409: and acquiring new target data again at intervals of a second preset time according to the source and the acquisition mode of the target data, and comparing the new target data with the target data in the first cache memory.
It should be noted that the second preset time period is preset.
Step S410: when the target data is modified, the new target data is synchronized to the first cache memory.
Specifically, the latest target data is obtained again according to the source and the obtaining mode of the target data at regular intervals, and is compared with the target data in the first cache memory, if the latest target data is different from the target data in the first cache memory, the target data is changed within the second preset time period in the past, and at the moment, the new target data is synchronized to the first cache memory again to cover the previous target data, so that the timeliness of the target data is guaranteed.
Step S411: and re-rendering the target page component according to the new target data.
Specifically, when the target data is changed, the target page component using the target data is automatically re-rendered, and the developer does not need to manually modify the target page component again, so that the development workload of the developer is reduced.
The page component development method according to the fourth embodiment of the present invention is based on the second embodiment, and detects whether the target data is changed at regular time, and if the target data is changed, synchronizes the changed data to the first cache memory to ensure timeliness of the target data, and re-renders the target page component generated by rendering the target data, thereby reducing development workload of developers.
Fig. 5 is a flowchart illustrating a page component development method according to a fifth embodiment of the present invention. It should be noted that the method of the present invention is not limited to the flow sequence shown in fig. 5 if the results are substantially the same. As shown in fig. 5, the method includes the steps of:
step S501: and acquiring the front-end development requirement.
In this embodiment, step S501 in fig. 5 is similar to step S101 in fig. 1, and for brevity, is not described herein again.
Step S502: target page components required and target data tags for required data are identified based on front-end development requirements.
In this embodiment, step S502 in fig. 5 is similar to step S102 in fig. 1, and for brevity, is not described herein again.
Step S503: and inquiring a target data source and an acquisition mode corresponding to the target data mark according to a pre-configured configuration file, acquiring target data through the target data source and the acquisition mode, and pre-storing the data source and the acquisition mode corresponding to each data mark by the configuration file.
In this embodiment, step S503 in fig. 5 is similar to step S103 in fig. 1, and for brevity, is not described herein again.
Step S504: and packaging the target data according to the format required by the target page component.
In this embodiment, step S504 in fig. 5 is similar to step S104 in fig. 1, and for brevity, is not described herein again.
Step S505: and rendering the target page component by using the packaged target data to obtain the target page component with the corresponding function.
In this embodiment, step S505 in fig. 5 is similar to step S105 in fig. 1, and for brevity, is not repeated herein.
Step S506: it is detected whether there are at least two target page components that need to use common data. If yes, go to step S507.
It should be noted that the data used by the page component includes two types, one is private data, is only used by the page component itself, and can be stored in the component script of the page component, and is maintained by the page component itself. The other is common data, i.e. data which is common to at least two page components, or which relates to interaction between at least two page components. One page component may include one or both of private data and common data.
Step S507: and setting a second cache memory, storing the common data into the second cache memory, and calling the common data from the second cache memory by at least two target page components.
Specifically, by establishing the second cache memory to store the common data commonly used among different target page components, when the target page components need to use the common data, the common data is directly acquired from the second cache memory, so that the common data commonly used among different target page components can be updated in time.
According to the page component development method, on the basis of the first embodiment, the second cache memory is arranged to store the common data among different page components, when the page components need to use the common data, the common data are directly called from the second cache memory, the consistency of the common data used among at least two page components is effectively guaranteed, developers do not need to write related codes additionally to guarantee the consistency of the common data among the at least two page components, the codes are further simplified integrally, and when the common data need to be modified, the data in the second cache memory only need to be modified, so that the maintenance difficulty is reduced.
Further, in some embodiments, after obtaining the target page component with the corresponding function, the method further includes: and uploading the target page component to the block chain.
Specifically, the corresponding digest information is obtained based on the target page component, and specifically, the digest information is obtained by hashing the target page component, for example, using the sha256s algorithm. Uploading summary information to the blockchain can ensure the safety and the fair transparency of the user. The user device may download the summary information from the blockchain to verify that the target page component has been tampered with. The blockchain referred to in this example is a novel application mode of computer technologies such as distributed data storage, point-to-point transmission, consensus mechanism, encryption algorithm, and the like. A block chain (Blockchain), which is essentially a decentralized database, is a series of data blocks associated by using a cryptographic method, and each data block contains information of a batch of network transactions, so as to verify the validity (anti-counterfeiting) of the information and generate a next block. The blockchain may include a blockchain underlying platform, a platform product service layer, an application service layer, and the like.
Fig. 6 is a functional module diagram of the page component development system according to the embodiment of the present invention. As shown in fig. 6, the pagecomponent development system 60 includes a first obtainingmodule 61, a confirmingmodule 62, a second obtainingmodule 63, apackaging module 64, and arendering module 65.
The first obtainingmodule 61 is configured to obtain front-end development requirements.
Avalidation module 62 for validating the required target page components and the target data tags of the required data based on the front-end development requirements.
The second obtainingmodule 63 is configured to query a target data source and a obtaining manner corresponding to the target data identifier according to a pre-configured configuration file, and obtain the target data through the target data source and the obtaining manner, where the configuration file stores the data source and the obtaining manner corresponding to each data identifier in advance.
And thepackaging module 64 is used for packaging the target data according to the format required by the target page component.
And therendering module 65 is configured to render the target page component by using the encapsulated target data, so as to obtain a target page component with a corresponding function.
Optionally, before the second obtainingmodule 63 queries the target data source and the obtaining mode corresponding to the target data flag according to the pre-configured configuration file, the second obtaining module is further configured to query whether target data exists in a preset first cache memory based on the target data flag; if yes, acquiring target data from the first cache memory; if not, the target data source and the acquisition mode corresponding to the target data mark and subsequent operations are inquired according to the pre-configured configuration file. And, if the second obtainingmodule 63 queries the target data source and the obtaining mode corresponding to the target data flag according to the pre-configured configuration file, and obtains the target data through the target data source and the obtaining mode, the second obtainingmodule 63 is further configured to store the target data corresponding to the target data flag in the first cache memory.
Optionally, after the operation of storing the target data corresponding to the target data flag in the first cache memory by the second obtainingmodule 63, the second obtaining module is further configured to delete the target data from the first cache memory when the storage time of the target data in the first cache memory reaches a first preset time length.
Optionally, after the second obtainingmodule 63 performs an operation of storing the target data corresponding to the target data flag in the first cache memory, the second obtaining module is further configured to obtain new target data again at intervals of a second preset duration according to the source and the obtaining mode of the target data, and compare the new target data with the target data in the first cache memory; when the target data is modified, synchronizing the new target data into the first cache memory; and re-rendering the target page component according to the new target data.
Optionally, therendering module 65 is further configured to, after obtaining the operation of the target page component with a corresponding function by rendering the target page component with the packaged target data, detect whether there are at least two target page components that need to use common data; if so, setting a second cache memory, storing the common data into the second cache memory, and calling the common data from the second cache memory by at least two target page components.
Optionally, the operation of the second obtainingmodule 63 obtaining the target data through the target data source and the obtaining manner may also be: acquiring initial data by using an acquisition mode based on a target data source; and acquiring a filtering condition, and filtering the initial data based on the filtering condition to obtain target data.
Optionally, therendering module 65 renders the target page component by using the packaged target data, and after obtaining the operation of the target page component with the corresponding function, is further configured to upload the target page component into the block chain.
For other details of the technical solution for implementing each module in the page component development system in the above embodiment, reference may be made to the description of the page component development method in the above embodiment, and details are not described here again.
It should be noted that, in the present specification, the embodiments are all described in a progressive manner, each embodiment focuses on differences from other embodiments, and the same and similar parts among the embodiments may be referred to each other. For the system-class embodiment, since it is basically similar to the method embodiment, the description is simple, and for the relevant points, reference may be made to the partial description of the method embodiment.
Referring to fig. 7, fig. 7 is a schematic structural diagram of a terminal according to an embodiment of the present invention. As shown in fig. 7, the terminal 70 includes amemory 71 and at least oneprocessor 72, thememory 71 having instructions stored therein; the at least oneprocessor 72 calls instructions in thememory 71 to implement the page component development method described in any of the above embodiments.
Theprocessor 71 may also be referred to as a CPU (Central Processing Unit). Theprocessor 71 may be an integrated circuit chip having signal processing capabilities. Theprocessor 71 may also be a general purpose processor, a Digital Signal Processor (DSP), an Application Specific Integrated Circuit (ASIC), a Field Programmable Gate Array (FPGA) or other programmable logic device, discrete gate or transistor logic, discrete hardware components. A general purpose processor may be a microprocessor or the processor may be any conventional processor or the like.
Referring to fig. 8, fig. 8 is a schematic structural diagram of a computer-readable storage medium according to an embodiment of the present invention. The computer readable storage medium of the embodiment of the present invention hasinstructions 81 stored thereon, and when theinstructions 81 are executed by the processor, the method for developing a page component as described in any one of the above is implemented.
Theinstructions 81 may be stored in the computer-readable storage medium in the form of a software product, so as to enable a computer device (which may be a personal computer, a server, or a network device) or a processor (processor) to execute all or part of the steps of the method according to the embodiments of the present application. And the aforementioned computer-readable storage media comprise: various media capable of storing program codes, such as a usb disk, a mobile hard disk, a Read-Only Memory (ROM), a Random Access Memory (RAM), a magnetic disk or an optical disk, or terminal devices, such as a computer, a server, a mobile phone, and a tablet.
In the several embodiments provided in the present application, it should be understood that the disclosed system, terminal and method can be implemented in other manners. For example, the above-described system embodiments are merely illustrative, and for example, a division of a unit is merely a logical division, and an actual implementation may have another division, for example, a plurality of units or components may be combined or integrated into another system, or some features may be omitted, or not executed. In addition, the shown or discussed mutual coupling or direct coupling or communication connection may be an indirect coupling or communication connection through some interfaces, devices or units, and may be in an electrical, mechanical or other form.
In addition, functional units in the embodiments of the present invention may be integrated into one processing unit, or each unit may exist alone physically, or two or more units are integrated into one unit. The integrated unit can be realized in a form of hardware, and can also be realized in a form of a software functional unit. The above embodiments are merely examples and are not intended to limit the scope of the present disclosure, and all modifications, equivalents, and flow charts using the contents of the specification and drawings of the present disclosure or those directly or indirectly applied to other related technical fields are intended to be included in the scope of the present disclosure.
Claims (10)
1. A page component development method, comprising:
acquiring a front-end development requirement;
confirming a required target page component and a target data mark of required data based on the front-end development requirement;
inquiring a target data source and an acquisition mode corresponding to the target data mark according to a pre-configured configuration file, and acquiring target data through the target data source and the acquisition mode, wherein the configuration file stores the data source and the acquisition mode corresponding to each data mark in advance;
packaging the target data according to a format required by the target page component;
and rendering the target page component by using the packaged target data to obtain the target page component with corresponding functions.
2. The method for developing a page component according to claim 1, wherein before querying the target data source and the acquisition mode corresponding to the target data flag according to the pre-configured configuration file, the method further comprises:
inquiring whether the target data exist in a preset first cache memory based on the target data mark;
if yes, acquiring the target data from the first cache memory;
if not, executing the step of inquiring the target data source and the acquisition mode corresponding to the target data mark according to a pre-configured configuration file;
after the target page component with the corresponding function is obtained, the method further comprises the following steps:
and storing the target data and the target data mark in the first cache memory after corresponding.
3. The method for developing a page component according to claim 2, wherein after the target data is stored in the first cache memory in correspondence with the target data flag, the method further comprises:
and when the storage time of the target data in the first cache memory reaches a first preset time length, deleting the target data from the first cache memory.
4. The method for developing a page component according to claim 2, wherein after the target data is stored in the first cache memory in correspondence with the target data flag, the method further comprises:
acquiring new target data again according to the source and the acquisition mode of the target data every second preset time interval, and comparing the new target data with the target data in the first cache memory;
when the target data is modified, synchronizing the new target data into the first cache memory;
and re-rendering the target page component according to the new target data.
5. The method for developing page components according to claim 1, wherein after obtaining the target page components with corresponding functions, the method further comprises:
detecting whether at least two target page components needing to use common data exist;
if so, setting a second cache memory, storing the common data into the second cache memory, and calling the common data from the second cache memory by the at least two target page components.
6. The method for developing page components according to claim 1, wherein the step of obtaining the target data by the target data source and the obtaining means includes:
acquiring initial data by using the acquisition mode based on the target data source;
and acquiring a filtering condition, and filtering the initial data based on the filtering condition to obtain the target data.
7. The method for developing page components according to claim 1, wherein after obtaining the target page components with corresponding functions, the method further comprises:
and uploading the target page component to a block chain.
8. A page component development system, comprising:
the first acquisition module is used for acquiring front-end development requirements;
the confirmation module is used for confirming the required target page component and the target data mark of the required data based on the front-end development requirement;
the second acquisition module is used for inquiring a target data source and an acquisition mode corresponding to the target data mark according to a pre-configured configuration file, acquiring target data through the target data source and the acquisition mode, and storing the data source and the acquisition mode corresponding to each data mark in the configuration file in advance;
the packaging module is used for packaging the target data according to a format required by the target page component;
and the rendering module is used for rendering the target page component by using the packaged target data to obtain the target page component with corresponding functions.
9. A terminal, characterized in that the terminal comprises: a memory and at least one processor, the memory having instructions stored therein; the at least one processor invoking the instructions in the memory to implement the page component development method of any of claims 1-7.
10. A computer-readable storage medium having instructions stored thereon, wherein the instructions, when executed by a processor, implement the page component development method of any one of claims 1-7.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011489807.8ACN112527258A (en) | 2020-12-16 | 2020-12-16 | Page component development method, system, terminal and computer readable storage medium |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011489807.8ACN112527258A (en) | 2020-12-16 | 2020-12-16 | Page component development method, system, terminal and computer readable storage medium |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN112527258Atrue CN112527258A (en) | 2021-03-19 |
Family
ID=75000750
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202011489807.8APendingCN112527258A (en) | 2020-12-16 | 2020-12-16 | Page component development method, system, terminal and computer readable storage medium |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN112527258A (en) |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113485799A (en)* | 2021-06-21 | 2021-10-08 | 上海百秋电子商务有限公司 | Method, device, equipment and storage medium for executing same timing task by multiple libraries |
| CN113641359A (en)* | 2021-08-30 | 2021-11-12 | 北京沃东天骏信息技术有限公司 | Data processing method and device |
| CN116701800A (en)* | 2023-08-07 | 2023-09-05 | 广州市千钧网络科技有限公司 | Page content processing method, device, computer equipment and medium |
Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107479861A (en)* | 2016-06-07 | 2017-12-15 | 阿里巴巴集团控股有限公司 | Page processing method and its system |
| CN108153798A (en)* | 2016-12-02 | 2018-06-12 | 阿里巴巴集团控股有限公司 | Page info processing method, apparatus and system |
| WO2018177260A1 (en)* | 2017-03-28 | 2018-10-04 | 腾讯科技（深圳）有限公司 | Application development method and tool, device, and storage medium thereof |
| CN108874389A (en)* | 2018-06-27 | 2018-11-23 | 中国建设银行股份有限公司 | front end page development framework |
| CN111475162A (en)* | 2020-03-27 | 2020-07-31 | 平安银行股份有限公司 | Page generating method, device, server and storage medium |
| CN111708961A (en)* | 2020-06-18 | 2020-09-25 | 深圳前海微众银行股份有限公司 | Page data acquisition method, apparatus, device and readable storage medium |
- 2020
- 2020-12-16CNCN202011489807.8Apatent/CN112527258A/enactivePending
Patent Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107479861A (en)* | 2016-06-07 | 2017-12-15 | 阿里巴巴集团控股有限公司 | Page processing method and its system |
| CN108153798A (en)* | 2016-12-02 | 2018-06-12 | 阿里巴巴集团控股有限公司 | Page info processing method, apparatus and system |
| WO2018177260A1 (en)* | 2017-03-28 | 2018-10-04 | 腾讯科技（深圳）有限公司 | Application development method and tool, device, and storage medium thereof |
| CN108874389A (en)* | 2018-06-27 | 2018-11-23 | 中国建设银行股份有限公司 | front end page development framework |
| CN111475162A (en)* | 2020-03-27 | 2020-07-31 | 平安银行股份有限公司 | Page generating method, device, server and storage medium |
| CN111708961A (en)* | 2020-06-18 | 2020-09-25 | 深圳前海微众银行股份有限公司 | Page data acquisition method, apparatus, device and readable storage medium |
Cited By (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113485799A (en)* | 2021-06-21 | 2021-10-08 | 上海百秋电子商务有限公司 | Method, device, equipment and storage medium for executing same timing task by multiple libraries |
| CN113485799B (en)* | 2021-06-21 | 2023-10-20 | 上海百秋新网商数字科技有限公司 | Method, device, equipment and storage medium for executing same timing task by multiple libraries |
| CN113641359A (en)* | 2021-08-30 | 2021-11-12 | 北京沃东天骏信息技术有限公司 | Data processing method and device |
| CN116701800A (en)* | 2023-08-07 | 2023-09-05 | 广州市千钧网络科技有限公司 | Page content processing method, device, computer equipment and medium |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN111611784B (en) | Report generation method, device, terminal equipment and storage medium | |
| CN112527258A (en) | Page component development method, system, terminal and computer readable storage medium | |
| CN111782216A (en) | Page generation method, server and storage medium | |
| CN111881209A (en) | Data synchronization method and device for heterogeneous database, electronic equipment and medium | |
| CN112230923B (en) | User interface rendering method, user interface rendering device and server | |
| CN108255513B (en) | Electronic device, springmvc-based data interface, automatic generation method of description of springmvc-based data interface, and storage medium | |
| CN104731869B (en) | The page shows method and device | |
| EP2320690A2 (en) | Interworking system between user terminal and smart card for executing widget, and method thereof | |
| CN114153856A (en) | Host data double write method and device | |
| CN108563492B (en) | Data acquisition method, virtual machine and electronic equipment | |
| CN110598188A (en) | Method and device for displaying annotations and computer-readable storage medium | |
| CN111383038A (en) | Advertisement display method and device of mobile terminal, mobile terminal and storage medium | |
| CN114610366A (en) | A differential package upgrade method, system, intelligent electronic device and storage medium | |
| CN113515717A (en) | Navigation page updating method and device, electronic equipment and storage medium | |
| CN111651488A (en) | Database service processing method, device, medium and electronic equipment | |
| CN111367606A (en) | Application page display method, device, terminal and medium | |
| CN106535002A (en) | Method and device for updating layout of desktop starter template | |
| CN116187286A (en) | Method, device, platform, storage medium and product for generating potential perception report | |
| CN114036132A (en) | Object information processing method, device, storage medium and electronic device | |
| CN115567595A (en) | Information processing method, information processing device, computer equipment and storage medium | |
| CN113765771A (en) | An instant message processing method and device | |
| CN111680014A (en) | Shared file acquisition method and device, electronic equipment and storage medium | |
| CN112099897B (en) | Method, computing device, and computer-readable storage medium for displaying a logo | |
| CN119759461B (en) | Method and device for displaying graphical user interface based on custom data module | |
| CN111506644A (en) | Application data processing method and device and electronic equipment |
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 | ||
| RJ01 | Rejection of invention patent application after publication | Application publication date:20210319 | |
| RJ01 | Rejection of invention patent application after publication |