CN111209055A - Page function configuration method and device based on Vue - Google Patents
Page function configuration method and device based on Vue Download PDFInfo
- Publication number
- CN111209055A CN111209055A CN201911415882.7A CN201911415882A CN111209055A CN 111209055 A CN111209055 A CN 111209055A CN 201911415882 A CN201911415882 A CN 201911415882A CN 111209055 A CN111209055 A CN 111209055A
- Authority
- CN
- China
- Prior art keywords
- configuration
- component
- page
- function
- functional component
- 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
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
- G06F9/44526—Plug-ins; Add-ons
Abstract
The invention relates to a page function configuration method based on a Vue.js frame, which specifically comprises the following steps: step S1: acquiring a functional component required by a page function corresponding to a display page, and setting the functional component according to the functional component to realize a configuration method and a configuration attribute corresponding to configuration; step S2: generating a configuration component corresponding to the functional component according to the configuration method and the configuration attribute; step S3: adding the configuration component to a configuration table of a configuration component library; step S4: calling the configuration components in the configuration component library, and editing the display page; step S5: rendering the edited display page and displaying the display page in a corresponding system. Compared with the prior art, the method has the advantages of quickly typesetting the page functions, improving the working efficiency of developers and the like.
Description
Technical Field
The invention relates to the technical field of computers, in particular to a page function configuration method and device based on a Vue.
Background
With the wide application of information systems, the usage scenarios become complicated, and the demand for personalization correspondingly arises. In different personalized requirements, an operator needs to compile a function page with personalized functions according to different user roles or different user habits. Because the personalized requirements cannot be communicated with each other, new requirements need to design a new function page, but the basic functions are similar. Operators need to develop functions meeting personalized requirements while retaining basic functions. The repeated and complicated operation increases the workload of the operator while reducing the working efficiency of the operator, and a large amount of time is needed for functional typesetting.
Disclosure of Invention
The invention aims to overcome the defects of complex and complicated page function layout in the prior art and provide a page function configuration method and device based on a Vue.
The purpose of the invention can be realized by the following technical scheme:
a page function configuration method based on vue.js frame, comprising the following steps:
step S1: acquiring a functional component required by a page function corresponding to a display page, and setting the functional component according to the functional component to realize a configuration method and a configuration attribute corresponding to configuration;
step S2: generating a configuration component corresponding to the functional component according to the configuration method and the configuration attribute;
step S3: adding the configuration component to a configuration table of a configuration component library;
step S4: calling the configuration components in the configuration component library, and editing the display page;
step S5: rendering the edited display page and displaying the display page in a corresponding system.
The configuration method comprises a framework conversion function, a configuration label display function, a configuration parameter storage function and a rendering function.
The configuration attributes include rectangular page parameters, node numbers, method parameters, and component titles.
The rectangular page parameters comprise the length and the width of the rectangular page and a coordinate system corresponding to the rectangular page.
Preferably, in the step S2, the module packager generates a configuration component corresponding to the functional component.
The function of the module packer comprises extracting component information which supports configuration in the functional components.
And the group attitude component is provided with a callback function matched with the corresponding functional component.
A device for applying the method for configuring page functions based on vue.js frame, the device comprising a processor and a memory, the method being stored in the memory as a computer program and being executable by the processor for performing the following steps:
step S1: acquiring a functional component required by a page function corresponding to a display page, and setting the functional component according to the functional component to realize a configuration method and a configuration attribute corresponding to configuration;
step S2: generating a configuration component corresponding to the functional component according to the configuration method and the configuration attribute;
step S3: adding the configuration component to a configuration table of a configuration component library;
step S4: calling the configuration components in the configuration component library, and editing the display page;
step S5: rendering the edited display page and displaying the display page in a corresponding system.
Compared with the prior art, the invention has the following beneficial effects:
1. according to the invention, the functional components required for displaying are organized, so that an operator can conveniently and quickly call the configuration components prestored in the configuration component library during page typesetting, and the page function quick typesetting is realized.
2. The configuration component pre-stored in the configuration component library can be called for multiple times, repeated basic function component design is reduced, and the working efficiency of developers is improved.
3. The invention realizes the adjustment aiming at the requirements of different service scenes by setting the corresponding configuration method and the configuration attribute, and can carry out page layout on equipment platforms with different configurations.
Drawings
FIG. 1 is a schematic flow chart of the present invention.
Detailed Description
The invention is described in detail below with reference to the figures and specific embodiments. The present embodiment is implemented on the premise of the technical solution of the present invention, and a detailed implementation manner and a specific operation process are given, but the scope of the present invention is not limited to the following embodiments.
As shown in fig. 1, a page function configuration method based on vue.js frame specifically includes the following steps:
step S1: acquiring functional components required by page functions corresponding to the display page, and setting the functional components according to the functional components to realize configuration corresponding configuration methods and configuration attributes;
step S2: generating a configuration component corresponding to the functional component according to the configuration method and the configuration attribute;
step S3: adding configuration components into a configuration table of a configuration component library;
step S4: calling a configuration component in a configuration component library, and editing a display page;
step S5: rendering the edited display page and displaying the display page in a corresponding system.
The component format of the functional component in step S1 is a single file component format of vue.
The configuration method comprises a framework conversion function, a configuration label display function, a configuration parameter storage function and a rendering function. And calling a framework conversion function when the position size of the component is changed, and transmitting the modified position size information into the system.
The configuration attributes include rectangular page parameters, node numbers, method parameters, and component titles.
The rectangular page parameters comprise the length and the width of the rectangular page and a coordinate system corresponding to the rectangular page.
In step S2, the module packager generates a configuration component corresponding to the functional component.
The function of the module packer comprises extracting component information which supports configuration in the functional components.
The configuration component is provided with a callback function matched with the corresponding functional component.
Js framework-based page function configuration method, the device comprising a processor and a memory, the method being stored in the memory in the form of a computer program and being executable by the processor to perform the following steps:
step S1: acquiring functional components required by page functions corresponding to the display page, and setting the functional components according to the functional components to realize configuration corresponding configuration methods and configuration attributes;
step S2: generating a configuration component corresponding to the functional component according to the configuration method and the configuration attribute;
step S3: adding configuration components into a configuration table of a configuration component library;
step S4: calling a configuration component in a configuration component library, and editing a display page;
step S5: rendering the edited display page and displaying the display page in a corresponding system.
In addition, it should be noted that the specific embodiments described in the present specification may have different names, and the above descriptions in the present specification are only illustrations of the structures of the present invention. Minor or simple variations in the structure, features and principles of the present invention are included within the scope of the present invention. Various modifications or additions may be made to the described embodiments or methods may be similarly employed by those skilled in the art without departing from the scope of the invention as defined in the appending claims.
Claims (8)
1. A page function configuration method based on a vue.js frame, which is characterized by comprising the following steps:
step S1: acquiring a functional component required by a page function corresponding to a display page, and setting the functional component according to the functional component to realize a configuration method and a configuration attribute corresponding to configuration;
step S2: generating a configuration component corresponding to the functional component according to the configuration method and the configuration attribute;
step S3: adding the configuration component to a configuration table of a configuration component library;
step S4: calling the configuration components in the configuration component library, and editing the display page;
step S5: rendering the edited display page and displaying the display page in a corresponding system.
2. The method according to claim 1, wherein the configuration method comprises a frame conversion function, a configuration tag display function, a configuration parameter storage function and a rendering function.
3. The method according to claim 1, wherein the configuration attributes include rectangular page parameters, node numbers, method parameters and component titles.
4. The method as claimed in claim 3, wherein the rectangular page parameters include length and width of the rectangular page and a coordinate system corresponding to the rectangular page.
5. The method according to claim 1, wherein in step S2, the module packer generates the configuration component corresponding to the functional component.
6. The method of claim 5, wherein the function of the module packer comprises extracting information of components supporting configuration in the functional components.
7. The method according to claim 1, wherein the configuration component is provided with a callback function matched with the corresponding functional component.
8. An apparatus for applying the Vue.js frame based page function configuration method according to claims 1-7, wherein the apparatus comprises a processor and a memory, the method is stored in the memory by means of a computer program, and when executed by the processor, the method implements the following steps:
step S1: acquiring a functional component required by a page function corresponding to a display page, and setting the functional component according to the functional component to realize a configuration method and a configuration attribute corresponding to configuration;
step S2: generating a configuration component corresponding to the functional component according to the configuration method and the configuration attribute;
step S3: adding the configuration component to a configuration table of a configuration component library;
step S4: calling the configuration components in the configuration component library, and editing the display page;
step S5: rendering the edited display page and displaying the display page in a corresponding system.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201911415882.7A CN111209055A (en) | 2019-12-31 | 2019-12-31 | Page function configuration method and device based on Vue |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201911415882.7A CN111209055A (en) | 2019-12-31 | 2019-12-31 | Page function configuration method and device based on Vue |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN111209055A true CN111209055A (en) | 2020-05-29 |
Family
ID=70789883
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201911415882.7A Pending CN111209055A (en) | 2019-12-31 | 2019-12-31 | Page function configuration method and device based on Vue |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111209055A (en) |
Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN105574049A (en) * | 2014-10-30 | 2016-05-11 | 阿里巴巴集团控股有限公司 | Page processing method, device and system of mobile applications |
| US20170161032A1 (en) * | 2015-12-02 | 2017-06-08 | Alibaba Group Holding Limited | Running applications using pre-generated components |
| CN109117138A (en) * | 2018-08-23 | 2019-01-01 | 北京和利时系统工程有限公司 | A kind of configuration method and device, computer readable storage medium |
| CN109445891A (en) * | 2018-10-09 | 2019-03-08 | 北京国电智深控制技术有限公司 | Picture configuration and methods of exhibiting, device, computer readable storage medium |
| CN109460232A (en) * | 2018-09-27 | 2019-03-12 | 深圳新基点智能股份有限公司 | A kind of production and monitoring method of the configuration page |
| CN109558524A (en) * | 2018-11-14 | 2019-04-02 | 无锡信捷电气股份有限公司 | The internet of things equipment monitoring method and device of configurableization |
| CN109862064A (en) * | 2018-11-22 | 2019-06-07 | 中国铁建重工集团有限公司 | A kind of configuration method and device for equipment remote monitoring |
| CN109918604A (en) * | 2019-03-07 | 2019-06-21 | 智慧芽信息科技(苏州)有限公司 | Page drawing method, apparatus, equipment and storage medium |
-
2019
- 2019-12-31 CN CN201911415882.7A patent/CN111209055A/en active Pending
Patent Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN105574049A (en) * | 2014-10-30 | 2016-05-11 | 阿里巴巴集团控股有限公司 | Page processing method, device and system of mobile applications |
| US20170161032A1 (en) * | 2015-12-02 | 2017-06-08 | Alibaba Group Holding Limited | Running applications using pre-generated components |
| CN109117138A (en) * | 2018-08-23 | 2019-01-01 | 北京和利时系统工程有限公司 | A kind of configuration method and device, computer readable storage medium |
| CN109460232A (en) * | 2018-09-27 | 2019-03-12 | 深圳新基点智能股份有限公司 | A kind of production and monitoring method of the configuration page |
| CN109445891A (en) * | 2018-10-09 | 2019-03-08 | 北京国电智深控制技术有限公司 | Picture configuration and methods of exhibiting, device, computer readable storage medium |
| CN109558524A (en) * | 2018-11-14 | 2019-04-02 | 无锡信捷电气股份有限公司 | The internet of things equipment monitoring method and device of configurableization |
| CN109862064A (en) * | 2018-11-22 | 2019-06-07 | 中国铁建重工集团有限公司 | A kind of configuration method and device for equipment remote monitoring |
| CN109918604A (en) * | 2019-03-07 | 2019-06-21 | 智慧芽信息科技(苏州)有限公司 | Page drawing method, apparatus, equipment and storage medium |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN110781423B (en) | Webpage generation method and device and electronic equipment | |
| US10740114B2 (en) | Component invoking method and apparatus, and component data processing method and apparatus | |
| CN108228119B (en) | Printing method based on HXML, terminal equipment and storage medium | |
| CN103051652B (en) | A kind of mobile terminal cloud computing distribution platform | |
| CN103544106A (en) | Method and device for generating script based on control | |
| CN104820589A (en) | Method and device for dynamically adapting webpage | |
| CN104636400A (en) | Browser webpage generating method, browser and system | |
| CN102262684A (en) | Method and device for generating webpage page of mobile terminal | |
| CN111324390A (en) | Device and method for realizing APP content configuration and real-time update | |
| CN109614565A (en) | Webpage generating method and device | |
| CN105242931A (en) | Method and system for editing and generating codes for game interface | |
| CN104133676A (en) | Function execution method and function execution device based on scripts | |
| CN105373545A (en) | Picture display method and device | |
| CN111476007B (en) | Table generation method, table generation device, computer device and computer-readable storage medium | |
| CN102375738B (en) | A kind of apparatus and method of mobile terminal data management | |
| CN112083926A (en) | Web user interface generation method and device | |
| CN105468573A (en) | Configurable diagram application system | |
| CN102253986A (en) | Method and device for improving webpage displaying effect in multiple terminals | |
| CN104834715A (en) | Website generating method and system based on components and container | |
| CN112926008B (en) | Method, device, electronic equipment and storage medium for generating form page | |
| CN104166551A (en) | Application interface developing method and developing device | |
| CN108399156A (en) | The composition method and device of formula in a kind of pdf document | |
| CN104793837A (en) | Picture generation method and device | |
| CN111209055A (en) | Page function configuration method and device based on Vue | |
| JP2004362577A (en) | Method and device for generating graphical user interface |
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 |