CN116257232A - Table generation method, device, equipment and storage medium based on table component - Google Patents
Table generation method, device, equipment and storage medium based on table component Download PDFInfo
- Publication number
- CN116257232A CN116257232A CN202310190712.3A CN202310190712A CN116257232A CN 116257232 A CN116257232 A CN 116257232A CN 202310190712 A CN202310190712 A CN 202310190712A CN 116257232 A CN116257232 A CN 116257232A
- Authority
- CN
- China
- Prior art keywords
- component
- control
- configuration information
- eltable
- globally
- 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; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/36—Software reuse
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/166—Editing, e.g. inserting or deleting
- G06F40/177—Editing, e.g. inserting or deleting of tables; using ruled lines
- G06F40/18—Editing, e.g. inserting or deleting of tables; using ruled lines of spreadsheets
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/166—Editing, e.g. inserting or deleting
- G06F40/186—Templates
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/33—Intelligent editors
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR 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
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Health & Medical Sciences (AREA)
- Artificial Intelligence (AREA)
- Audiology, Speech & Language Pathology (AREA)
- Computational Linguistics (AREA)
- General Health & Medical Sciences (AREA)
- Databases & Information Systems (AREA)
- Data Mining & Analysis (AREA)
- Stored Programmes (AREA)
Abstract
The application relates to the technical field of web pages, in particular to a table generation method, a device, equipment and a storage medium based on a table component. The method comprises the following steps: introducing a package.json file under a root directory of the target program into an Element UI control library, and globally introducing an ELTable control in the Element UI control library; acquiring a table component written based on an ELTable control, and globally registering the table component; acquiring configuration information edited by a user in a page matched with the form component; wherein the configuration information includes information for characterizing a target table; a target table is generated based on the configuration information and the table component. Thus, the generation of the table can be completed only by the table component based on the global configuration, and the table display and operation data are further used.
Description
Technical Field
The application relates to the technical field of web pages, in particular to a table generation method, a device, equipment and a storage medium based on a table component.
Background
At present, web projects of some companies have a plurality of pages needing to use form display and operation data, in order to achieve the purposes, a mode of introducing an Element UI page control library is generally adopted, so that development cost is reduced to a certain extent, but when similar or even repeated form requirements are met due to business requirements, repeated editing codes of users are required to call the Element UI page control library, on one hand, repeated work of developers is increased, and on the other hand, repeated codes of the projects are greatly generated, so that iterative development of the following projects is not facilitated.
Disclosure of Invention
In view of this, embodiments of the present application are directed to providing a method, apparatus, device, and storage medium for generating a table based on a table component.
The first aspect of the present application provides a form generating method based on a form component, including:
introducing a package.json file under a root directory of the target program into an Element UI control library, and globally introducing an ELTable control in the Element UI control library;
acquiring a table component written based on an ELTable control, and globally registering the table component;
acquiring configuration information edited by a user in a page matched with the form component; wherein the configuration information includes information for characterizing a target table;
a target table is generated based on the configuration information and the table component.
In some embodiments, the global introduction of ELTable controls in the Element UI control library includes:
using vue.use, ELTable controls are introduced globally.
In some embodiments, the ELTable control-based written form component employs an HTML template engine named pug.
In some embodiments, the configuration information includes column attribute information;
the column attribute information is used to indicate the contents of the target column.
In some embodiments, before obtaining the configuration information edited by the user in the page matching the form component, the method further comprises:
acquiring user information;
the user information comprises a user name, a department, a role type, a name, a contact way, an email box and remark information.
In some embodiments, further comprising:
acquiring an export request;
the target table and/or the configuration information is derived based on the derivation request.
In some embodiments, the target program is a program of a web project.
A second aspect of the present application provides a form generating apparatus based on a form component, including:
the introduction module is used for introducing the package.json file under the root directory of the target program into the Element UI control library and globally introducing the ELTable control in the Element UI control library;
the first acquisition module is used for acquiring a table component written based on the ELTable control and globally registering the table component; introducing a package.json file under a root directory of the target program into an Element UI control library, and globally introducing an ELTable control in the Element UI control library;
the second acquisition module is used for acquiring a table component written based on the ELTable control and globally registering the table component;
the third acquisition module acquires configuration information edited by a user in a page matched with the form component; wherein the configuration information includes information for characterizing a target table;
and the generation module is used for generating a target table based on the configuration information and the table component.
A third aspect of the present application provides an electronic device, comprising:
a processor and a memory for storing a program executable by the processor;
the processor is configured to implement a table generating method based on a table component as described above by running a program in the memory.
A fourth aspect of the present application provides a computer readable storage medium having stored thereon a computer program which, when executed by a processor, causes the processor to perform a form generation method based on form components as described above.
According to the table generation method based on the table component, a package.json file under a root directory of a target program is introduced into an Element UI control library, and an ELTable control in the Element UI control library is globally introduced; acquiring a table component written based on an ELTable control, and globally registering the table component; acquiring configuration information edited by a user in a page matched with the form component; wherein the configuration information includes information for characterizing a target table; a target table is generated based on the configuration information and the table component. In the scheme provided by the application, the generation of the table can be completed only by the table component based on the global configuration, and then the table display and the operation data are used. The repeated editing codes of the user are not required to call the Element UI page control library, repeated work of a developer is reduced, repeated codes in projects are avoided from being largely appeared, and iterative development of the following projects is facilitated.
Drawings
The foregoing and other objects, features and advantages of the present application will become more apparent from the following more particular description of embodiments of the present application, as illustrated in the accompanying drawings. The accompanying drawings are included to provide a further understanding of embodiments of the application and are incorporated in and constitute a part of this specification, illustrate the application and not constitute a limitation to the application. In the drawings, like reference numerals generally refer to like parts or steps.
Fig. 1 is a flow chart of a table generating method based on a table component according to an embodiment of the present application.
Fig. 2 is a schematic structural diagram of a table generating device based on a table component according to an embodiment of the present application.
Fig. 3 is a schematic structural diagram of an electronic device according to an embodiment of the present application.
Detailed Description
The following description of the embodiments of the present invention will be made clearly and completely with reference to the accompanying drawings, in which it is apparent that the embodiments described are only some embodiments of the present invention, but not all embodiments. All other embodiments, which can be made by those skilled in the art based on the embodiments of the invention without making any inventive effort, are intended to be within the scope of the invention.
Summary of the application
At present, web projects of some companies have a plurality of pages needing to use form display and operation data, in order to achieve the purposes, a mode of introducing an Element UI page control library is generally adopted, so that development cost is reduced to a certain extent, but when similar or even repeated form requirements are met due to business requirements, repeated editing codes of users are required to call the Element UI page control library, on one hand, repeated work of developers is increased, and on the other hand, repeated codes of the projects are greatly generated, so that iterative development of the following projects is not facilitated.
In order to solve the problems, the application provides a scheme, wherein a package. Json file under a root directory of a target program is introduced into an Element UI control library, and an ELTable control in the Element UI control library is globally introduced; acquiring a table component written based on an ELTable control, and globally registering the table component; acquiring configuration information edited by a user in a page matched with the form component; wherein the configuration information includes information for characterizing a target table; a target table is generated based on the configuration information and the table component. In the scheme provided by the application, the generation of the table can be completed only by the table component based on the global configuration, and then the table display and the operation data are used. The repeated editing codes of the user are not required to call the Element UI page control library, repeated work of a developer is reduced, repeated codes in projects are avoided from being largely appeared, and iterative development of the following projects is facilitated.
Having described the basic principles of the present application, various non-limiting embodiments of the present application will now be described in detail with reference to the accompanying drawings.
Exemplary method
Fig. 1 is a flow chart of a table generating method based on a table component according to an embodiment of the present application. As shown in fig. 1, the method includes the following.
S110, introducing a package.json file under a root directory of a target program into an Element UI control library, and globally introducing an ELTable control in the Element UI control library;
wherein the target program is a program of a web project and is based on a vue framework.
S120, acquiring a table component written based on an ELTable control, and globally registering the table component;
s130, acquiring configuration information edited by a user in a page matched with the form component; wherein the configuration information includes information for characterizing a target table;
and S140, generating a target table based on the configuration information and the table component.
It should be noted that the Element UI control library is an open source control library, and a large number of mature components are stored in the Element UI, so that development difficulty of the components can be reduced by means of the Element UI control library. In the scheme provided by the application, the Element UI control library is firstly introduced into the package.json file under the root directory of the target program, and the ELTable control in the Element UI control library is globally introduced, so that support can be provided for subsequent writing of the form component.
Specifically, the code of the package. Json file under the root directory for introducing the Element UI control library is approximately as follows:
further, using vue.use, ELTable controls are introduced globally. It should be noted that, since the object program generally uses a vue framework, when the ELTable control is globally introduced therein, the object program is installed by using a vue.
import Vue from'vue';
import{Table}from'element-ui';
Vue.use(Table);
Further, the table component written based on the ELTable control adopts an HTML template engine named pug. Specifically, the code is as follows:
through the components, a user can conduct list rendering to generate each column of the table by transmitting an option attribute, and each column can customize contents, including but not limited to characters and operation buttons.
And then globally registering the app-table component written in the previous step and exporting the app-table component, wherein the specific codes are as follows:
thus, when a form needs to be generated, the app-table component can be directly used on a page needing to write the form control, and specific codes are as follows:
app-table(:option='option')
In some embodiments, the solution provided in the present application further includes:
acquiring an export request; and exporting a target table and/or configuration information based on the export request.
When the target table is required to be finely adjusted, the configuration information can be directly exported, the configuration information is adjusted, and then the adjusted configuration information is uploaded to complete the adjustment of the target table, and the target table can be directly exported for other use.
In the scheme provided by the application, based on the Element UI control library, a table component is arranged on the overall situation of the target program, and when a user needs to use a table, the table can be generated only by the table component based on overall situation configuration, and then the table is displayed and the operation data are used. The repeated editing codes of the user are not required to call the Element UI page control library, repeated work of a developer is reduced, repeated codes in projects are avoided from being largely appeared, and iterative development of the following projects is facilitated.
Exemplary apparatus
The embodiment of the application device can be used for executing the embodiment of the application method. For details not disclosed in the device embodiments of the present application, please refer to the method embodiments of the present application.
Fig. 2 is a block diagram of a table generating device based on a table component according to an embodiment of the present application. As shown in fig. 2, the apparatus includes:
the introducing module 21 is used for introducing the package. Json file under the root directory of the target program into the Element UI control library and globally introducing the ELTable control in the Element UI control library;
a first obtaining module 22, configured to obtain a table component written based on an ELTable control, and globally register the table component; introducing a package.json file under a root directory of the target program into an Element UI control library, and globally introducing an ELTable control in the Element UI control library;
a second obtaining module 23, configured to obtain a table component written based on an ELTable control, and globally register the table component;
a third obtaining module 24, configured to obtain configuration information edited by a user in a page matched with the table component; wherein the configuration information includes information for characterizing a target table;
a generating module 25, configured to generate a target table based on the configuration information and the table component.
In the scheme provided by the application, based on the Element UI control library, a form component is arranged on the global of the target program, and when a user needs to use the form, the form can be generated only by the form component based on global configuration, so that the form is displayed and the operation data are used. The repeated editing codes of the user are not required to call the Element UI page control library, repeated work of a developer is reduced, repeated codes in projects are avoided from being largely appeared, and iterative development of the following projects is facilitated.
In some embodiments, the global introduction of ELTable controls in the Element UI control library includes:
using vue.use, ELTable controls are introduced globally.
In some embodiments, the ELTable control-based written form component employs an HTML template engine named pug.
In some embodiments, the configuration information includes column attribute information;
the column attribute information is used to indicate the contents of the target column.
In some embodiments, before obtaining the configuration information edited by the user in the page matching the form component, the method further comprises:
acquiring user information;
the user information comprises a user name, a department, a role type, a name, a contact way, an email box and remark information.
In some embodiments, further comprising:
acquiring an export request;
and exporting a target table and or configuration information based on the export request.
In some embodiments, the target program is a program of a web project.
Exemplary electronic device
Next, an electronic device according to an embodiment of the present application is described with reference to fig. 3. Fig. 3 illustrates a block diagram of an electronic device according to an embodiment of the present application.
As shown in fig. 3, electronic device 300 includes one or more processors 310 and memory 320.
The processor 310 may be a Central Processing Unit (CPU) or other form of processing unit having data processing and/or instruction execution capabilities, and may control other components in the electronic device 300 to perform desired functions.
Memory 320 may include one or more computer program products that may include various forms of computer-readable storage media, such as volatile memory and/or non-volatile memory. The volatile memory may include, for example, random Access Memory (RAM) and/or cache memory (cache), and the like. The non-volatile memory may include, for example, read Only Memory (ROM), hard disk, flash memory, and the like. One or more computer program instructions may be stored on the computer readable storage medium that can be executed by the processor 310 to implement the table component-based table generation method and/or other desired functions of the various embodiments of the present application described above. Various contents such as category correspondence may also be stored in the computer-readable storage medium.
In one example, the electronic device 300 may further include: input device 330 and output device 340, which are interconnected by a bus system and/or other form of connection mechanism (not shown).
In addition, the input device 330 may also include, for example, a keyboard, a mouse, an interface, and the like. The output device 340 may output various information including analysis results and the like to the outside. The output device 340 may include, for example, a display, speakers, a printer, and a communication network and remote output devices connected thereto, etc.
Of course, only some of the components of the electronic device that are relevant to the present application are shown in fig. 3 for simplicity, components such as buses, input/output interfaces, etc. being omitted. In addition, the electronic device may include any other suitable components depending on the particular application.
Exemplary computer program product and computer readable storage Medium
In addition to the methods and apparatus described above, embodiments of the present application may also be a computer program product comprising computer program instructions which, when executed by a processor, cause the processor to perform the steps in a method of generating a table based on a table component according to various embodiments of the present application described in the "exemplary methods" section of the present specification.
The computer program product may write program code for performing the operations of embodiments of the present application in any combination of one or more programming languages, including an object oriented programming language such as Java, C++ or the like and conventional procedural programming languages, such as the "C" programming language or similar programming languages. The program code may execute entirely on the user's computing device, partly on the user's device, as a stand-alone software package, partly on the user's computing device, partly on a remote computing device, or entirely on the remote computing device or server.
Furthermore, embodiments of the present application may also be a computer-readable storage medium, having stored thereon computer program instructions, which when executed by a processor, cause the processor to perform the steps in a table component-based table generation method according to various embodiments of the present application described in the above "exemplary method" section of the present specification.
The computer readable storage medium may employ any combination of one or more readable media. The readable medium may be a readable signal medium or a readable storage medium. The readable storage medium may include, for example, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or a combination of any of the foregoing. More specific examples (a non-exhaustive list) of the readable storage medium would include the following: an electrical connection having one or more wires, a portable disk, a hard disk, random Access Memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.
The foregoing description has been presented for purposes of illustration and description. Furthermore, this description is not intended to limit the embodiments of the application to the form disclosed herein. Although a number of example aspects and embodiments have been discussed above, a person of ordinary skill in the art will recognize certain variations, modifications, alterations, additions, and subcombinations thereof.
Claims (10)
1. A form generation method based on a form component, comprising:
introducing a package.json file under a root directory of the target program into an Element UI control library, and globally introducing an ELTable control in the Element UI control library;
acquiring a table component written based on an ELTable control, and globally registering the table component;
acquiring configuration information edited by a user in a page matched with the form component; wherein the configuration information includes information for characterizing a target table;
a target table is generated based on the configuration information and the table component.
2. The form component-based form generation method of claim 1, wherein the globally introduced Element UI control library comprises:
using vue.use, ELTable controls are introduced globally.
3. The form component-based form generation method of claim 1, wherein the ELTable control-based form component employs an HTML template engine named pug.
4. The form component-based form generation method of claim 2, wherein the configuration information includes column attribute information;
the column attribute information is used to indicate the contents of the target column.
5. The form component-based form generation method of claim 2, further comprising, prior to obtaining configuration information compiled by a user in a page matching the form component:
acquiring user information;
the user information comprises a user name, a department, a role type, a name, a contact way, an email box and remark information.
6. The form component-based form generation method of claim 2, further comprising:
acquiring an export request;
the target table and/or the configuration information is derived based on the derivation request.
7. The form component-based form generation method of claim 1, wherein the target program is a program of a web item.
8. A form generation apparatus based on a form component, comprising:
the introduction module is used for introducing the package.json file under the root directory of the target program into the Element UI control library and globally introducing the ELTable control in the Element UI control library;
the first acquisition module is used for acquiring a table component written based on the ELTable control and globally registering the table component; introducing a package.json file under a root directory of the target program into an Element UI control library, and globally introducing an ELTable control in the Element UI control library;
the second acquisition module is used for acquiring a table component written based on the ELTable control and globally registering the table component;
the third acquisition module acquires configuration information edited by a user in a page matched with the form component; wherein the configuration information includes information for characterizing a target table;
and the generation module is used for generating a target table based on the configuration information and the table component.
9. An electronic device, comprising:
a processor and a memory for storing a program executable by the processor;
the processor is configured to implement the table generating method based on the table component according to any one of claims 1 to 7 by running the program in the memory.
10. A computer-readable storage medium, characterized in that the computer-readable storage medium has stored thereon a computer program which, when executed by a processor, causes the processor to perform the form generation method based on a form component as claimed in any one of claims 1 to 7.
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310190712.3A CN116257232A (en) | 2023-02-23 | 2023-02-23 | Table generation method, device, equipment and storage medium based on table component |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310190712.3A CN116257232A (en) | 2023-02-23 | 2023-02-23 | Table generation method, device, equipment and storage medium based on table component |
Publications (1)
Publication Number | Publication Date |
---|---|
CN116257232A true CN116257232A (en) | 2023-06-13 |
Family
ID=86682229
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202310190712.3A Pending CN116257232A (en) | 2023-02-23 | 2023-02-23 | Table generation method, device, equipment and storage medium based on table component |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN116257232A (en) |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN117034886A (en) * | 2023-08-10 | 2023-11-10 | 北京字跳网络技术有限公司 | Information processing method, apparatus, electronic device and storage medium |
-
2023
- 2023-02-23 CN CN202310190712.3A patent/CN116257232A/en active Pending
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN117034886A (en) * | 2023-08-10 | 2023-11-10 | 北京字跳网络技术有限公司 | Information processing method, apparatus, electronic device and storage medium |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US8601438B2 (en) | Data transformation based on a technical design document | |
CN108595171B (en) | Object model generation method, device, equipment and storage medium | |
US8701082B2 (en) | Method and apparatus for generating a model-driven development user interface | |
CN110968305A (en) | Applet visualization generation method, device, equipment and storage medium | |
US9141344B2 (en) | Hover help support for application source code | |
CN110688145B (en) | Android MVP code automatic generation method and device, medium and electronic equipment | |
CN110727429B (en) | Front-end page generation method, device and equipment | |
CN114153459A (en) | Interface document generation method and device | |
CN116257232A (en) | Table generation method, device, equipment and storage medium based on table component | |
CN114579452A (en) | Interface influence detection method and related equipment | |
CN116028028A (en) | Request function generation method, device, equipment and storage medium | |
CN109189388A (en) | Page configuration method, server and computer-readable medium | |
CN113760266B (en) | Method and device for creating function module file and electronic equipment | |
CN110874216B (en) | Complete code generation method, device, equipment and storage medium | |
CN114048415A (en) | Form generation method and device, electronic equipment and computer readable storage medium | |
CN113419711A (en) | Page guiding method and device, electronic equipment and storage medium | |
CN112667202B (en) | Software design method and device combining MDA and BPMN | |
CN112000416B (en) | Card view generation method, device and computer readable storage medium | |
WO2022099913A1 (en) | Interface configuration method and apparatus, and device and medium | |
CN114579461A (en) | Browser compatibility detection method and related equipment | |
CN111475156B (en) | Page code generation method and device, electronic equipment and storage medium | |
CN113885841A (en) | Script generation method and device, electronic equipment and readable medium | |
CN107357926B (en) | Webpage processing method and device and electronic equipment | |
CN112667274A (en) | Method and device for generating application programming interface document and electronic equipment | |
JP7216317B1 (en) | Information processing device, its control method, and program |
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 |