CN111427552A - Front-end component development method and device, computer equipment and storage medium - Google Patents

Front-end component development method and device, computer equipment and storage medium Download PDF

Info

Publication number
CN111427552A
CN111427552A CN202010125131.8A CN202010125131A CN111427552A CN 111427552 A CN111427552 A CN 111427552A CN 202010125131 A CN202010125131 A CN 202010125131A CN 111427552 A CN111427552 A CN 111427552A
Authority
CN
China
Prior art keywords
page
request
component
development
calling
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
Application number
CN202010125131.8A
Other languages
Chinese (zh)
Inventor
谢春阳
周晶
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
OneConnect Smart Technology Co Ltd
OneConnect Financial Technology Co Ltd Shanghai
Original Assignee
OneConnect Financial Technology Co Ltd Shanghai
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by OneConnect Financial Technology Co Ltd Shanghai filed Critical OneConnect Financial Technology Co Ltd Shanghai
Priority to CN202010125131.8A priority Critical patent/CN111427552A/en
Publication of CN111427552A publication Critical patent/CN111427552A/en
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code

Abstract

The embodiment of the invention discloses a front-end component development method, a front-end component development device, computer equipment and a storage medium, wherein the method comprises the steps of analyzing a new request to generate an initial page if the new request of a front-end page is received; calling a preset JS package for front-end development from a local resource database; obtaining the type of the current front-end framework to determine an API (application programming interface) interface associated with the type in the JS package; if a front-end component calling request sent by an initial page is received, acquiring a component calling function matched with the front-end component calling request through an API (application programming interface); and if a parameter setting request matched with the component calling function is received, the component calling function is operated according to the parameters in the parameter setting request, so that a front-end component with corresponding parameters is called from the JS package, and the called front-end component is combined with the initial page, and therefore development and display of the corresponding front-end page are achieved. The invention has wide application range and can realize front-end development under different front-end frames.

Description

Front-end component development method and device, computer equipment and storage medium
Technical Field
The present invention relates to the field of front-end technologies, and in particular, to a front-end component development method and apparatus, a computer device, and a storage medium.
Background
The background management system is a subset of a Content Management System (CMS), namely a website management system. A web site management system separates the content (text, pictures, etc.) of a web site from the components of the web site and links the pages together to control the display of the pages. Through the background management system, the content of the front-end website can be managed, released and maintained conveniently. At present, the development of front-end web pages has been developed from a back-end template to a front-end component, however, the front-end component of the existing back-end system has a high professional level and cannot meet the development and use requirements of non-front-end personnel, and meanwhile, the front-end component has multiple functions but not special functions, especially the dependence of each front-end component on a front-end framework is high, and cannot meet the requirements of a highly customized system and provide more independent services.
Disclosure of Invention
The embodiment of the invention provides a front-end component development method and device, computer equipment and a storage medium, which are used for realizing front-end development under different front-end frameworks.
In a first aspect, an embodiment of the present invention provides a front-end component development method, where the method includes:
if a new request of a front-end page is received, analyzing the new request to generate a corresponding initial page;
calling a preset JS package for front-end development from a local resource database, wherein the JS package comprises a plurality of front-end components for calling, and different front-end components are used for realizing different functions;
obtaining the type of the current front-end framework to determine an API (application programming interface) interface associated with the type in the JS package;
if a front-end component calling request sent by an initial page is received, acquiring a component calling function matched with the front-end component calling request through the API;
and if a parameter setting request matched with the component calling function is received, operating the component calling function according to the parameters in the parameter setting request so as to call a front-end component with corresponding parameters from the JS package, and combining the called front-end component with the initial page so as to realize development and display of the corresponding front-end page.
In a second aspect, an embodiment of the present invention further provides a front-end component development apparatus, where the apparatus includes:
the page generating unit is used for analyzing a new request to generate a corresponding initial page if the new request of a front-end page is received;
the JS packet calling unit is used for calling a preset JS packet for front-end development from a local resource database, wherein the JS packet comprises a plurality of front-end components for calling, and different front-end components are used for realizing different functions;
an interface determining unit, configured to obtain a type of a current front-end framework to determine an API interface associated with the type in the JS package;
the function obtaining unit is used for obtaining a component calling function matched with a front-end component calling request through the API if the front-end component calling request sent through an initial page is received;
and the processing unit is used for operating the component calling function according to the parameters in the parameter setting request if the parameter setting request matched with the component calling function is received, so as to call the front-end component with the corresponding parameters from the JS package, and combine the called front-end component with the initial page to realize the development and display of the corresponding front-end page.
In a third aspect, an embodiment of the present invention further provides a computer device, which includes a memory and a processor, where the memory stores a computer program, and the processor implements the above method when executing the computer program.
In a fourth aspect, the present invention also provides a computer-readable storage medium, which stores a computer program, and the computer program can implement the above method when being executed by a processor.
The embodiment of the invention provides a front-end component development method and device, computer equipment and a storage medium. Wherein the method comprises the following steps: if a new request of a front-end page is received, analyzing the new request to generate a corresponding initial page; calling a preset JS packet for front-end development from a local resource database; obtaining the type of the current front-end framework to determine an API (application programming interface) interface associated with the type in the JS package; if a front-end component calling request sent by an initial page is received, acquiring a component calling function matched with the front-end component calling request through the API; and if a parameter setting request matched with the component calling function is received, operating the component calling function according to the parameters in the parameter setting request so as to call a front-end component with corresponding parameters from the JS package, and combining the called front-end component with the initial page so as to realize development and display of the corresponding front-end page. According to the embodiment of the invention, the JS packet can be called, and the corresponding parameters can be adjusted according to corresponding requirements, so that front-end development under different front-end frameworks can be realized, the application range is wide, development and use of a user can be facilitated, the development cost is saved, the requirements of a high-customization system are met, and the use experience of the user is improved.
Drawings
In order to more clearly illustrate the technical solutions of 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 these drawings without creative efforts.
Fig. 1 is a schematic flow chart illustrating a front-end component development method according to an embodiment of the present invention;
fig. 1a is a schematic view of an application scenario of a front-end component development method according to an embodiment of the present invention;
FIG. 2 is a sub-flow diagram of a front-end component development method according to an embodiment of the present invention;
FIG. 3 is a flow chart illustrating a method for front-end component development according to another embodiment of the present invention;
fig. 4 is a schematic block diagram of a front-end componentization development apparatus according to an embodiment of the present invention;
fig. 5 is a schematic block diagram of a function obtaining unit of a front-end componentized development apparatus according to an embodiment of the present invention;
fig. 6 is a schematic block diagram of a front-end componentization development apparatus according to another embodiment of the present invention;
fig. 7 is a schematic structural diagram of a computer device according to an embodiment of the present invention.
Detailed Description
The technical solutions in the embodiments of the present invention will be clearly and completely described below with reference to the drawings in the embodiments of the present invention, and it is obvious that the described embodiments are some, not all, embodiments of the present invention. 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 invention.
It will be understood that the terms "comprises" and/or "comprising," when used in this specification and the appended claims, specify the presence of stated features, integers, steps, operations, elements, and/or components, but do not preclude the presence or addition of one or more other features, integers, steps, operations, elements, components, and/or groups thereof.
It is also to be understood that the terminology used in the description of the invention herein is for the purpose of describing particular embodiments only and is not intended to be limiting of the invention. As used in the specification of the present invention and the appended claims, the singular forms "a," "an," and "the" are intended to include the plural forms as well, unless the context clearly indicates otherwise.
Referring to fig. 1 and fig. 1a, fig. 1 is a schematic flow chart of a front-end component development method according to an embodiment of the present application, and fig. 1a is a schematic view of a scenario of the front-end component development method according to the embodiment of the present application. The front-end componentization development method is applied to the management server 10. After receiving the new request initiated on the page of the front end 20, the management server 10 generates an initial page at the front end 20, can adjust the corresponding parameters according to the corresponding requirements by calling the JS package, and then calls the front end component with the corresponding parameters by using a component calling function, and combines the called front end component with the initial page to realize development and display of the corresponding front end page, that is, realize front end development under different front end frames. The steps of the front-end component development method will be described in detail below from the perspective of the management server 10.
Referring to fig. 1, fig. 1 is a schematic flow chart of a front-end component development method according to an embodiment of the present invention. As shown in fig. 1, the steps of the method include steps S101 to S105.
Step S101, if a new request of a front-end page is received, the new request is analyzed to generate a corresponding initial page.
In this embodiment, the front-end page, i.e., the foreground portion of the website, runs on a browser, such as a PC end or a mobile end, and displays a webpage browsed by a user. The management server can develop the front-end page, and when a new request for developing the front-end page sent by a user is received, an initial page without content can be generated. Typically, the initial page may be a blank Html page.
Step S102, calling a pre-set JS package for front-end development from a local resource database, wherein the JS package comprises a plurality of front-end components for calling, and different front-end components are used for realizing different functions.
In the present embodiment, the local resource database refers to a database for storing JS packages for front-end development. The JS package is a compression package integrating a plurality of different front-end components, and can further comprise a plurality of API interfaces so that a user can develop a front-end page under different front-end frames, different API interfaces are correspondingly associated with different front-end frames, namely different front-end frames need to call the corresponding API interfaces, and the front-end page can be developed by utilizing the JS package, so that the development efficiency of the front-end page is improved, and the user can rapidly utilize the front-end components under different front-end frames. The API interface may be a calling function, and different API interfaces may be determined by setting relevant parameters of the function.
The front-end components may generally include two types, one type being functional components and the other type being UI-type components. The functional components can comprise components with business logic related functions, such as an searching component, a data presentation component, an editing component, an authority control component, a form checking component, an information processing component and the like. The searching component refers to components for realizing related pages and logics such as forms and searching buttons; the data display component refers to implementation components of relevant pages and logic such as tables and pages; the newly added component refers to a component for realizing related pages and logics of newly added forms, form verification, data submission and the like; the editing component refers to a component for realizing related pages and logics such as form data playback, form verification, data submission and the like.
The UI components can comprise components with vision related functions, such as menu components, detail component webpage layout components, pop-up window display components, form control components, table display components and the like. The menu component is a component for realizing related pages and logics such as menu data display, sequencing, operation animation and the like; the detail component refers to a component for realizing related pages and logic such as form data playback and the like. In general, various parameters to be configured for data transmission between a front-end page and a back-end server are encapsulated in corresponding components, so that a user can call the parameters through different functions, and development of the front-end page is realized.
And step S103, acquiring the type of the current front-end framework to determine the API interface associated with the type in the JS package.
The front end framework in the present application may be a contact framework, for example, and the API interface associated with the contact framework may be a global function, i.e., HTM L function.
And step S104, if a front-end component calling request sent by an initial page is received, acquiring a component calling function matched with the front-end component calling request through the API.
In this embodiment, when the user selects the required front-end component, the management server may determine and obtain the component calling function matching the front-end calling request through the determined API interface, so that the user may select the corresponding parameter according to the requirement.
For example, if the API interface is an HTM L function, and the front-end component call request is a function for determining the head of the front-end page, the corresponding component call function is a head () function, the specific parameter is a local resource address that can be selected by the user, different local resource addresses point to different parameters, and the user can select an address corresponding to a preset parameter as required, so as to directly develop the corresponding front-end page, reduce the requirement that the user needs to know the programming in the development process, and greatly improve the practical range and development efficiency of the front-end page development and maintenance.
As shown in fig. 2, in an embodiment, the step S104 may further include the following steps:
in step S201, if a front-end component call request is received, the front-end component call request is analyzed to determine a component call function to be called. If the management server receives the call request of the front-end component, the call request of the front-end component can be directly analyzed, and therefore the component call function required to be called is determined.
Step S202, connecting the API interface to obtain the component calling function. The management server can directly acquire the component calling function matched with the front-end component calling request by connecting with the API.
Step S105, if a parameter setting request matched with the component calling function is received, the component calling function is operated according to the parameters in the parameter setting request, so that a front-end component with corresponding parameters is called from the JS package, and the called front-end component is combined with the initial page, and therefore development and display of the corresponding front-end page are achieved.
In this embodiment, the parameter setting request matched with the component calling function refers to a request for setting a corresponding parameter according to a requirement of a user, and may include related parameter setting information. If the management server receives a parameter setting request matched with the component calling function, the component calling function can be operated according to parameters in the parameter setting request, so that a front-end component with corresponding parameters is called from the JS package, and the front-end component is combined with the initial interface, so that development and display of a corresponding front-end page are achieved, namely development of the front-end page is achieved.
In a further embodiment, the method further comprises the steps of:
step S106, if a page editing request of a front end page is received, determining a front end component to be edited in the front end page according to the page editing request. When the management server receives a page editing request sent by a user through a front-end page, the corresponding front-end component to be edited can be determined, and therefore the parameters of the front-end component can be edited by calling a function through the corresponding component. In one embodiment, the page editing request includes one or more of a page addition request, a page deletion request, a page modification request, and a page query request.
Step S107, relevant parameters in the component calling function corresponding to the front-end component to be edited are adjusted to realize corresponding page change. The management server can adjust relevant parameters in a corresponding component calling function of the front-end component to be edited, so that the front-end page can be modified and edited.
In summary, the manner of developing the front-end page by the front-end component in the embodiment is not only suitable for different front-end frames, but also suitable for scenes where the front-end developer of the back-end system is insufficient or absent, and the back-end developer can use the front-end component to generate a corresponding front-end page and complete front-end and back-end data transmission on the premise of unfamiliarity with the front-end technology, so as to quickly implement system functions and maximally save development cost.
Referring to fig. 3, fig. 3 is a schematic flow chart of a front-end component development method according to another embodiment of the present invention. As shown in fig. 3, the steps of the method include steps S301 to S305. The related explanations and detailed descriptions of the steps similar to steps S101-S105 in the above embodiment are not repeated herein, and the following detailed descriptions are the added steps in this embodiment.
Step S301, if a new request of a front-end page is received, the new request is analyzed to generate a corresponding initial page.
Step S302a, it is determined whether the JS package for front-end development that is set in advance is included in the local resource database. If the local resource database includes a preset JS package for front-end development, the step S302 is executed.
Step S302b, if the local resource database does not include the preset JS package for front-end development, downloading the JS package according to the preset address. If the management server detects that the local resource database does not include the JS packet, the JS packet required by the local resource database can be downloaded by detecting the preset address, so that corresponding calling is facilitated.
Step S302, a pre-set JS package for front-end development is called from a local resource database, wherein the JS package comprises a plurality of front-end components for calling, and different front-end components are used for realizing different functions.
Step S303, acquiring the type of the current front-end framework to determine the API interface associated with the type in the JS package.
Step S304, if a front-end component call request sent through the initial page is received, obtaining a component call function matched with the front-end component call request through the API interface.
Step S305, if a parameter setting request matched with the component calling function is received, the component calling function is operated according to the parameters in the parameter setting request, so that a front-end component with corresponding parameters is called from the JS package, and the called front-end component is combined with the initial page, and therefore development and display of the corresponding front-end page are achieved.
It will be understood by those skilled in the art that all or part of the processes of the methods of the embodiments described above can be implemented by a computer program, which can be stored in a computer-readable storage medium, and when executed, can include the processes of the embodiments of the methods described above. The storage medium may be a magnetic disk, an optical disk, a Read-only memory (ROM), or the like.
Referring to fig. 4, in response to the above-mentioned front-end component development method, an embodiment of the invention further provides a front-end component development apparatus, where the apparatus 100 includes: the JS package calling method includes a page generating unit 101, a JS package calling unit 102, an interface determining unit 103, a function acquiring unit 104, and a processing unit 105.
The page generating unit 101 is configured to, if a new request of a front-end page is received, parse the new request to generate a corresponding initial page.
In this embodiment, the front-end page, i.e., the foreground portion of the website, runs on a browser, such as a PC end or a mobile end, and displays a webpage browsed by a user. The management server can develop the front-end page, and when a new request for developing the front-end page sent by a user is received, an initial page without content can be generated. Typically, the initial page may be a blank Html page.
The JS package calling unit 102 is configured to call a preset JS package for front-end development from a local resource database, where the JS package includes multiple front-end components that can be called, and different front-end components are used to implement different functions.
In the present embodiment, the local resource database refers to a database for storing JS packages for front-end development. The JS package is a compression package integrating a plurality of different front-end components, and can further comprise a plurality of API interfaces so that a user can develop a front-end page under different front-end frames, different API interfaces are correspondingly associated with different front-end frames, namely different front-end frames need to call the corresponding API interfaces, and the front-end page can be developed by utilizing the JS package, so that the development efficiency of the front-end page is improved, and the user can rapidly utilize the front-end components under different front-end frames. The API interface may be a calling function, and different API interfaces may be determined by setting relevant parameters of the function. The front-end components may generally include two types, one type being functional components and the other type being UI-type components.
The interface determining unit 103 is configured to obtain a type of the current front-end framework to determine an API interface associated with the type in the JS package.
The front end framework in the present application may be a contact framework, for example, and the API interface associated with the contact framework may be a global function, i.e., HTM L function.
The function obtaining unit 104 is configured to, if a front-end component call request sent through an initial page is received, obtain, through the API interface, a component call function matched with the front-end component call request.
In this embodiment, when the user selects the required front-end component, the management server may determine and obtain the component calling function matching the front-end calling request through the determined API interface, so that the user may select the corresponding parameter according to the requirement.
For example, if the API interface is an HTM L function, and the front-end component call request is a function for determining the head of the front-end page, the corresponding component call function is a head () function, the specific parameter is a local resource address that can be selected by the user, different local resource addresses point to different parameters, and the user can select an address corresponding to a preset parameter as required, so as to directly develop the corresponding front-end page, reduce the requirement that the user needs to know the programming in the development process, and greatly improve the practical range and development efficiency of the front-end page development and maintenance.
As shown in fig. 5, in an embodiment, the function obtaining unit 104 may include a request parsing unit 201 and an interface connection unit 202.
The request parsing unit 201 is configured to, if a front-end component call request is received, parse the front-end component call request to determine a component call function to be called. If the management server receives the call request of the front-end component, the call request of the front-end component can be directly analyzed, and therefore the component call function required to be called is determined.
The interface connection unit 202 is configured to connect to the API interface to obtain the component calling function. The management server can directly acquire a component calling function matched with the front-end component calling request by connecting with the aAPI interface.
The processing unit 105 is configured to, if a parameter setting request matched with the component calling function is received, run the component calling function according to a parameter in the parameter setting request, so as to call a front-end component having a corresponding parameter from the JS package, and combine the called front-end component with the initial page, thereby implementing development and display of a corresponding front-end page.
In this embodiment, the parameter setting request matched with the component calling function refers to a request for setting a corresponding parameter according to a requirement of a user, and may include related parameter setting information. If the management server receives a parameter setting request matched with the component calling function, the component calling function can be operated according to parameters in the parameter setting request, so that a front-end component with corresponding parameters is called from the JS package, and the front-end component is combined with the initial interface, so that development and display of a corresponding front-end page are achieved, namely development of the front-end page is achieved.
In a further embodiment, the apparatus 100 further comprises the following units:
the component determining unit 106 is configured to determine, if a page editing request of a front-end page is received, a front-end component to be edited in the front-end page according to the page editing request. When the management server receives a page editing request sent by a user through a front-end page, the corresponding front-end component to be edited can be determined, and therefore the parameters of the front-end component can be edited by calling a function through the corresponding component. In one embodiment, the page editing request includes one or more of a page addition request, a page deletion request, a page modification request, and a page query request.
A page modification unit S107, configured to adjust a relevant parameter in an assembly call function corresponding to the front-end assembly to be edited, so as to implement corresponding page modification. The management server can adjust relevant parameters in a corresponding component calling function of the front-end component to be edited, so that the front-end page can be modified and edited.
Referring to fig. 6, in response to the above-mentioned front-end component development method, another embodiment of the present invention further provides a front-end component development apparatus, where the apparatus 300 includes: a page generating unit 301, a judging unit 302a, a downloading unit 302b, a JS package calling unit 302, an interface determining unit 303, a function acquiring unit 304, and a processing unit 305.
The page generating unit 301 is configured to, if a new request of a front-end page is received, parse the new request to generate a corresponding initial page.
The judging unit 302a is configured to judge whether a JS package for front-end development is included in the local resource database. If the local resource database includes a preset JS package for front-end development, the step S302 is executed.
The downloading unit 302b is configured to download the JS package according to the preset address if the local resource database does not include the preset JS package for front-end development. If the management server detects that the local resource database does not include the JS packet, the JS packet required by the local resource database can be downloaded by detecting the preset address, so that corresponding calling is facilitated.
The JS package calling unit 302 is configured to call a preset JS package for front-end development from a local resource database, where the JS package includes multiple front-end components that can be called, and different front-end components are used to implement different functions.
The interface determining unit 303 is configured to obtain a type of the current front-end framework to determine an API interface associated with the type in the JS package.
The function obtaining unit 304 is configured to, if a front-end component call request sent through an initial page is received, obtain, through the API interface, a component call function matched with the front-end component call request.
The processing unit 305 is configured to, if a parameter setting request matched with the component calling function is received, run the component calling function according to the parameter in the parameter setting request, so as to call a front-end component having a corresponding parameter from the JS package, and combine the called front-end component with the initial page, thereby implementing development and display of a corresponding front-end page.
It should be noted that, as will be clear to those skilled in the art, the specific implementation process of the front-end component development apparatus 100 and each unit can refer to the corresponding description in the foregoing method embodiments, and for convenience and brevity of description, no further description is provided herein.
As can be seen from the above, in terms of hardware implementation, the above page generating unit 101, the JS packet calling unit 102, the interface determining unit 103, the function obtaining unit 104, and the processing unit 105 may be embedded in hardware or independent of a front-end component-based device, or may be stored in software in a memory of the front-end component-based device, so that the processor calls to execute operations corresponding to the above units. The processor can be a Central Processing Unit (CPU), a microprocessor, a singlechip and the like.
The front-end componentized development apparatus described above may be implemented in the form of a computer program that can be run on a computer device as shown in fig. 7.
FIG. 7 is a schematic diagram of a computer device according to the present invention. The device may be a server, where the server may be an independent server or a server cluster composed of a plurality of servers.
Referring to fig. 7, the computer device 400 includes a processor 402, a memory, an internal memory 404, and a network interface 405 connected by a system bus 401, wherein the memory may include a nonvolatile storage medium 403 and the internal memory 404.
The non-volatile storage medium 403 can store an operating system 4031 and computer programs 4032, which when executed, can cause the processor 402 to perform a front-end component development method.
The processor 402 is used to provide computing and control capabilities that support the operation of the overall computer device 400.
The memory 404 provides an environment for the operation of the computer program 4032 on the non-volatile storage medium 403, which when executed by the processor 402, causes the processor 402 to perform a front-end componentization development method.
The network interface 405 is used for network communication with other devices. Those skilled in the art will appreciate that the architecture shown in fig. 7 is merely a block diagram of some of the structures associated with the disclosed aspects and is not intended to limit the computing device 400 to which the disclosed aspects apply, as a particular computing device 400 may include more or less components than those shown, or may combine certain components, or have a different arrangement of components.
The processor 402 is configured to run the computer program 4032 stored in the memory to implement the front-end component development method as in any of the above embodiments.
It should be understood that in the embodiment of the present application, the processor 402 may be a Central Processing Unit (CPU), and the processor 402 may also be other general-purpose processors, Digital Signal Processors (DSPs), Application Specific Integrated Circuits (ASICs), Field-programmable gate arrays (FPGAs) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, and the like. Wherein a general purpose processor may be a microprocessor or the processor may be any conventional processor or the like.
It will be understood by those skilled in the art that all or part of the flow of the method implementing the above embodiments may be implemented by a computer program instructing associated hardware. The computer program may be stored in a storage medium, which is a computer-readable storage medium. The computer program is executed by at least one processor in the computer system to implement the flow steps of the embodiments of the method described above.
Accordingly, the present invention also provides a storage medium. The storage medium may be a computer-readable storage medium. The storage medium stores a computer program that, when executed by a processor, causes the processor to execute the front-end component development method of any of the above embodiments.
The storage medium is an entity and non-transitory storage medium, and may be various entity storage media capable of storing program codes, such as a usb disk, a removable hard disk, a Read-only memory (ROM), a magnetic disk, or an optical disk.
Those of ordinary skill in the art will appreciate that the elements and algorithm steps of the examples described in connection with the embodiments disclosed herein may be embodied in electronic hardware, computer software, or combinations of both, and that the components and steps of the examples have been described in a functional general in the foregoing description for the purpose of illustrating clearly the interchangeability of hardware and software. Whether such functionality is implemented as hardware or software depends upon the particular application and design constraints imposed on the implementation. Skilled artisans may implement the described functionality in varying ways for each particular application, but such implementation decisions should not be interpreted as causing a departure from the scope of the present invention.
In the embodiments provided in the present invention, it should be understood that the disclosed apparatus and method may be implemented in other ways. For example, the above-described apparatus embodiments are merely illustrative. For example, the division of each unit is only one logic function division, and there may be another division manner in actual implementation. For example, various elements or components may be combined or may be integrated into another system, or some features may be omitted, or not implemented.
The steps in the method of the embodiment of the invention can be sequentially adjusted, combined and deleted according to actual needs. The units in the device of the embodiment of the invention can be merged, divided and deleted according to actual needs. 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, if implemented in the form of a software functional unit and sold or used as a stand-alone product, may be stored in a storage medium. Based on such understanding, the technical solution of the present invention essentially or partially contributes to the prior art, or all or part of the technical solution can be embodied in the form of a software product, which is stored in a storage medium and includes instructions for causing a computer device (which may be a personal computer, a terminal, or a network device) to execute all or part of the steps of the method according to the embodiments of the present invention.
While the invention has been described with reference to specific embodiments, the invention is not limited thereto, and various equivalent modifications and substitutions can be easily made by those skilled in the art within the technical scope of the invention. Therefore, the protection scope of the present invention shall be subject to the protection scope of the claims.

Claims (10)

1. A method of front-end componentization development, the method comprising:
if a new request of a front-end page is received, analyzing the new request to generate a corresponding initial page;
calling a preset JS package for front-end development from a local resource database, wherein the JS package comprises a plurality of front-end components for calling, and different front-end components are used for realizing different functions;
obtaining the type of the current front-end framework to determine an API (application programming interface) interface associated with the type in the JS package;
if a front-end component calling request sent by an initial page is received, acquiring a component calling function matched with the front-end component calling request through the API;
and if a parameter setting request matched with the component calling function is received, operating the component calling function according to the parameters in the parameter setting request so as to call a front-end component with corresponding parameters from the JS package, and combining the called front-end component with the initial page so as to realize development and display of the corresponding front-end page.
2. The method of claim 1, wherein the step of obtaining, via the API interface, a component calling function that matches a front-end component call request sent via an initial page, if the front-end component call request is received, comprises:
if a front-end component calling request is received, analyzing the front-end component calling request to determine a component calling function required to be called;
and connecting the API interface to acquire the component calling function.
3. The method of claim 1, wherein the method further comprises:
if a page editing request of a front-end page is received, determining a front-end component to be edited in the front-end page according to the page editing request;
and adjusting related parameters in an assembly call function corresponding to the front-end assembly to be edited so as to realize corresponding page change.
4. The method of claim 3, wherein the page edit request comprises one or more of a page add request, a page delete request, a page change request, and a page query request.
5. The method of claim 1, wherein calling a pre-provisioned JS package for front-end development from a local resource database, the JS including a plurality of front-end components available for calling, different front-end components for implementing different functions, further comprising, prior to the step of:
judging whether a preset JS packet for front-end development is included in a local resource database;
if the local resource database comprises the preset JS packet for front-end development, executing the preset JS packet for front-end development is called from the local resource database, the JS comprises a plurality of front-end components which can be called, and different front-end components are used for realizing different functions.
6. The method of claim 5, wherein the method further comprises:
and if the local resource database does not comprise a preset JS package for front-end development, downloading the JS package according to a preset address.
7. A front-end componentization development apparatus, comprising:
the page generating unit is used for analyzing a new request to generate a corresponding initial page if the new request of a front-end page is received;
the JS packet calling unit is used for calling a preset JS packet for front-end development from a local resource database, wherein the JS packet comprises a plurality of front-end components for calling, and different front-end components are used for realizing different functions;
an interface determining unit, configured to obtain a type of a current front-end framework to determine an API interface associated with the type in the JS package;
the function obtaining unit is used for obtaining a component calling function matched with a front-end component calling request through the API if the front-end component calling request sent through an initial page is received;
and the processing unit is used for operating the component calling function according to the parameters in the parameter setting request if the parameter setting request matched with the component calling function is received, so as to call the front-end component with the corresponding parameters from the JS package, and combine the called front-end component with the initial page to realize the development and display of the corresponding front-end page.
8. The apparatus of claim 7, wherein the function obtaining unit comprises:
the request analysis unit is used for analyzing the front-end component calling request to determine a component calling function required to be called if the front-end component calling request is received;
and the interface connection unit is used for connecting the API interface so as to obtain the component calling function.
9. A computer arrangement, characterized in that the computer arrangement comprises a memory having stored thereon a computer program and a processor implementing the method according to any of claims 1-6 when executing the computer program.
10. A computer-readable storage medium, characterized in that the storage medium stores a computer program which, when executed by a processor, causes the processor to carry out the method according to any one of claims 1-6.
CN202010125131.8A 2020-02-27 2020-02-27 Front-end component development method and device, computer equipment and storage medium Pending CN111427552A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202010125131.8A CN111427552A (en) 2020-02-27 2020-02-27 Front-end component development method and device, computer equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202010125131.8A CN111427552A (en) 2020-02-27 2020-02-27 Front-end component development method and device, computer equipment and storage medium

Publications (1)

Publication Number Publication Date
CN111427552A true CN111427552A (en) 2020-07-17

Family

ID=71547301

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202010125131.8A Pending CN111427552A (en) 2020-02-27 2020-02-27 Front-end component development method and device, computer equipment and storage medium

Country Status (1)

Country Link
CN (1) CN111427552A (en)

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN112217731A (en) * 2020-10-16 2021-01-12 青岛海尔科技有限公司 Target application generation method and device and storage medium
CN112764870A (en) * 2021-01-29 2021-05-07 北京达佳互联信息技术有限公司 Ranking list obtaining method and device, electronic equipment and storage medium
CN113110836A (en) * 2021-03-25 2021-07-13 南京飞灵智能科技有限公司 VUE-based front-end application componentization development method and device
CN114138254A (en) * 2021-11-30 2022-03-04 北京宇信科技集团股份有限公司 Automatic code generation method, medium, equipment and system

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN112217731A (en) * 2020-10-16 2021-01-12 青岛海尔科技有限公司 Target application generation method and device and storage medium
CN112764870A (en) * 2021-01-29 2021-05-07 北京达佳互联信息技术有限公司 Ranking list obtaining method and device, electronic equipment and storage medium
CN113110836A (en) * 2021-03-25 2021-07-13 南京飞灵智能科技有限公司 VUE-based front-end application componentization development method and device
CN113110836B (en) * 2021-03-25 2024-04-02 南京飞灵智能科技有限公司 Front-end application componentization development method and device based on VUE
CN114138254A (en) * 2021-11-30 2022-03-04 北京宇信科技集团股份有限公司 Automatic code generation method, medium, equipment and system
CN114138254B (en) * 2021-11-30 2022-06-07 北京宇信科技集团股份有限公司 Automatic code generation method, medium, equipment and system

Similar Documents

Publication Publication Date Title
CN111427552A (en) Front-end component development method and device, computer equipment and storage medium
CN109460279A (en) Forms pages development approach, device, equipment and storage medium based on small routine
US20230308504A9 (en) Method and system of application development for multiple device client platforms
CN109672580A (en) Full link monitoring method, apparatus, terminal device and storage medium
CA2992249C (en) Visual interactive voice response system
CN107644075B (en) Method and device for collecting page information
CN111475161B (en) Method, device and equipment for accessing component
CN111984239B (en) Page configuration method, page configuration device, server and storage medium
CN110297671A (en) Client plug-in implementation method, device, computer equipment and storage medium
CN104536398B (en) Frequency converter monitoring method and system
CN104811485A (en) Resource sharing method
CN110795353B (en) Quick application debugging method, device, equipment and storage medium
CN115543827A (en) Buried point data display method and device
CN111061448A (en) Log information display method and device, electronic equipment and storage medium
CN112307386A (en) Information monitoring method, system, electronic device and computer readable storage medium
CN111435328B (en) Application testing method and device, electronic equipment and readable storage medium
CN107566519B (en) Code operation method and device, server and server cluster
CN108021317B (en) Method and device for screen editing
CN115495068A (en) VUE page generation method and device
CN113626321B (en) Bridging test method, device, system and storage medium
TW201504818A (en) Webpage content browsing method, apparatus and terminal device thereof
WO2017096889A1 (en) Method and device for upgrading and downgrading system
CN114371866A (en) Version reconfiguration test method, device and equipment of service system
CN108563485B (en) Input panel display method and device
CN112214712A (en) Automatic browser switching method and device, storage medium 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