CN-121996239-A - Low-code component template implementation method
Abstract
The invention discloses a low-code component template implementation method, which relates to the technical field of low-code component templates and aims to solve the technical problems of poor component reusability and high technical threshold caused by scene abstraction deletion of a current low-code platform. According to the invention, by inducing the components into three core scenes of a list, a form and details and combining the three-level asset library of the layout template, the page template and the component template with the template matching decision function, the accurate retrieval, multiplexing and precipitation of the templates are realized, the repeated development is greatly reduced, meanwhile, the front-end interactive logic function is preset, the core processes of data refreshing, real-time verification, state reservation and the like are covered, a developer does not need to write interactive codes manually, the development period is shortened, and the technical threshold is reduced.
Inventors
- JI WEI
Assignees
- 北京白龙马云行科技有限公司
Dates
- Publication Date
- 20260508
- Application Date
- 20260121
Claims (10)
- 1. A method for implementing a low code component template, comprising the steps of: s100, demand analysis, namely developing demand analysis of newly enhanced Paas development, and defining specific demands of business functions, page presentation and interaction logic; s200, abstracting and constructing a layout template, namely, abstracting a page basic layout in a standardized way; S300, abstracting and constructing a page template, namely abstracting the whole structure of the page on the basis of a layout template to form a reusable page template; S400, abstract modeling of a component template scene, namely constructing by scene standardized abstraction, hierarchical architecture design and a template realization mechanism; S401, analyzing the function requirements of components in a page template, carding the service scene types of core components, and standardizing the components into three core scenes, namely a list scene, a form scene and a detail scene; S402, designing a component template by adopting a layered architecture, dividing three independent modules of a presentation layer, a logic layer and a data layer, and realizing decoupling of each core capability; S403, presetting complete front-end interaction logic in a component template, and defining a unified data service interaction interface; S404, building a visual configuration interface of the assembly template, and supporting graphical parameter configuration; s405, constructing a component template library, and storing the component templates of the three scenes into the library in a classified manner; S500, page production, namely based on the layout template library, the page template library, three-level template assets of the component template library, a visual configuration interface, a standardized data interface and a component expansion mechanism core configuration mechanism, realizing the rapid generation of the low-code application page.
- 2. The method for implementing the low-code component template according to claim 1, wherein the step S200 further comprises the steps of: s201, judging whether the page layout corresponding to the current requirement needs to be abstract or not, and if the page layout does not need to be abstract, directly entering a step S300 of page template abstract and construction; S2011, if layout abstraction is needed, checking whether a matched layout template exists in a layout template library, directly multiplexing the layout template if the matched layout template exists, and entering a step S300 of page template abstraction and construction; S2012, if the layout template does not exist, creating a target layout template based on the requirement, storing the target layout template in a layout template library in a classified mode, and entering a step S300 of page template abstraction and construction.
- 3. The method for implementing the low-code component template according to claim 1, wherein in the step S300, the method further comprises the steps of: s301, judging whether a page corresponding to the current requirement needs to be abstracted into a page template or not, and if the page template is not needed to be abstracted, directly entering a page production link in the step S500; S302, production debugging is conducted on the page template, integrity and interaction continuity of the page structure are verified, a stable version of the page template is generated, and the stable version is classified and stored in a page template library.
- 4. The method for implementing the low-code component template according to claim 2, wherein the step S500 further comprises the steps of: S501, page template decision, namely starting a page template matching judging flow under the layout or no layout determined in the step S200, and judging whether a page template meeting the service requirement exists in a page template library; S502, presence of a reusable template: s5021, selecting a template, namely selecting a matched standardized page template according to a visual retrieval result of a page template library; S5022, configuring and generating, namely setting template parameters, data sources and fields through the visual configuration interface constructed in the step S400, and automatically calling the mechanisms from the step S200 to the step S400 by the system to generate a target page; s503, no reusable template exists: S5031, creating a new template, namely performing secondary development based on the closest standard template or completely creating a template; s5032, depositing assets, namely storing the newly created template into a page template library; And S504, page building and delivery, wherein the configured template is rendered into a final executable application page by utilizing a aPaaS engine.
- 5. The method for implementing the low-code component template according to claim 1, wherein the implementation of the component scene abstraction in step S401 includes: the list scene supports data set display, screening, sorting and paging operations, and has built-in multi-condition combined screening, ascending/descending switching sorting and paging size configurable functions; The form scene supports data creation and editing, presets mobile phone numbers, mailboxes, numbers and non-empty check rules, and supports custom check logic; the detail scene supports the detailed display of single data, provides the date formatting and the amount precision control data formatting function, and supports the display of associated data.
- 6. The method for implementing a low-code component template according to claim 1, wherein the layered architecture of step S402 specifically includes: The presentation layer adopts a Vue/act framework to realize the UI layout of the component and supports drag adjustment and visual style modification; the logic layer encapsulates form verification, state management and event processing interaction logic to realize real-time verification, state recording and event response; The data layer provides a unified data service interface supporting automatic data acquisition, submission and format conversion.
- 7. The method for implementing a low-code component template according to claim 1, wherein the front-end interaction logic preset in step S403 includes: the list scene automatically triggers data refreshing and reserves the complete flow of paging state when the screening condition is changed; The form scene realizes real-time verification of the input content, allows submission after verification is passed, and returns to the closed loop logic of the list page after the prompt information is successfully displayed after the submission.
- 8. The method according to claim 1, wherein the visual configuration interface of step S404 provides: a basic parameter configuration area, wherein the display attribute of the component is set through a checkbox and a drop-down frame; a field configuration area supporting drag adjustment of field order and type; a pattern configuration area providing a color pickup, a pitch slider visual adjustment pattern; And the interface configuration area configures data interface parameters through the key value form.
- 9. The method according to claim 1, wherein the component template library in step S405 adopts a three-level storage structure: the first level is divided into a list, a form and a detail component library according to scene types; the second level subdivides a basic list according to the function labels and classifies the functions of the editable list; And updating iteration according to the version number management template.
- 10. The method for implementing the low-code component template according to claim 4, wherein the page template matching determination procedure in step S501 includes: performing double verification through a label matching system and template structure preview; Setting a matching threshold standard based on the integrity satisfaction of the core function; And automatically checking layout suitability of the matched templates, and providing an adjustment scheme when conflicts exist.
Description
Low-code component template implementation method Technical Field The invention relates to the technical field of low-code component templates, in particular to a low-code component template implementation method. Background Under the background of continuous deepening of enterprise digital transformation, application development demands represent large-scale and diversified growth situations, and a low-code development platform becomes a key technical scheme for reducing development thresholds and shortening development periods by virtue of core advantages of visual operation and assembly construction. The low-code development platform based on ali-lowcode engine is a current widely applied prior art in industry, and the core idea is that by providing a basic component library, a developer is allowed to construct an application page in a mode of dragging components and simply configuring parameters, so that the dependency on pure code development is eliminated to a certain extent. The existing low-code platform usually operates based on a visual development mode, and the use flow mainly comprises the following core links: in the visual interface provided by the platform, the developer performs page layout design by dragging the basic components (such as buttons, input frames, tables and the like), and then configures display properties and basic interaction behaviors of the components through the property panel. For data interaction requirements, a developer needs to manually write data interface call logic and realize front-end and back-end data mapping relations in a component event callback function. Taking list page development as an example, a developer needs to set a table column definition, a paging parameter and a screening condition respectively, and independently write a data request, a state management and an event processing code. The operation mode exposes significant defects that the lack of systematic abstraction on the front-end page scene causes poor component reusability, forces a developer to repeatedly write similar codes, and the design of a component template is stiff, is difficult to adapt to diversified business requirements, such as manual processing of interactive logic of lists, forms and detail pages, so that non-technicians still need to understand front-end details when using the platform, and the popularization efficiency of a low-code platform is severely limited. In view of this, we propose a low code component template implementation method. Disclosure of Invention The invention aims to overcome the defects of the prior art, adapt to the actual needs, and provide a low-code component template implementation method so as to solve the technical problems of poor component reusability and high technical threshold caused by scene abstraction deletion of the current low-code platform. In order to solve the technical problems, the invention provides a low-code component template implementation method, which comprises the following steps: s100, demand analysis, namely developing demand analysis of newly-enhanced Paas development, and defining specific demands of business functions, page presentation and interaction logic. S200, abstracting and constructing a layout template, namely, abstracting a page basic layout in a standardized way; S300, abstracting and constructing a page template, namely abstracting the whole structure of the page on the basis of a layout template to form a reusable page template; S400, abstract modeling of a component template scene, namely constructing by scene standardized abstraction, hierarchical architecture design and a template realization mechanism; S401, analyzing the function requirements of components in a page template, carding the service scene types of core components, and standardizing the components into three core scenes, namely a list scene, a form scene and a detail scene; S402, designing a component template by adopting a layered architecture, dividing three independent modules of a presentation layer, a logic layer and a data layer, and realizing decoupling of each core capability; S403, presetting complete front-end interaction logic in a component template, and defining a unified data service interaction interface; S404, building a visual configuration interface of the assembly template, and supporting graphical parameter configuration; s405, constructing a component template library, and storing the component templates of the three scenes into the library in a classified manner; s500, page production, namely based on the three-level template assets of the layout template library, the page template library and the component template library, and core configuration mechanisms such as a visual configuration interface, a standardized data interface, a component expansion mechanism and the like, realizing the rapid generation of the low-code application page. Preferably, the step S200 further includes the following steps: s201, judging w