Page generation method and device, equipment, storage medium and program product

Abstract

The invention discloses a page generation method and device, equipment, a storage medium and a program product, which are used for quickly and conveniently realizing page updating and iteration, reducing the iteration workload and improving the iteration efficiency under the condition of not influencing the operation of an existing page. The page generation method comprises the following steps: loading a low-code template into an original code file of an application program; running the low-code template, and displaying a visual editing interface; responding to a page editing operation of the visual editing interface, and generating page data of a newly added page of the application program; and registering the routing information of the page data into the original code file.

Description

Technical Field

[0001] This application relates to the field of computer technology, and in particular to a page generation method, apparatus, device, storage medium, and program product. Background Technology

[0002] Running applications often have page iteration requirements. While ensuring existing page functionality remains available, the faster page iterations are developed based on these requirements, the better it is for the application's future development. Summary of the Invention

[0003] The purpose of this application is to provide a page generation method, apparatus, device, storage medium, and program product, which can quickly and conveniently realize page update and iteration without affecting the operation of existing pages, reduce the workload of iteration, and improve iteration efficiency.

[0004] To achieve the above objectives, the embodiments of this application adopt the following technical solutions:

[0005] In a first aspect, embodiments of this application provide a page generation method, including:

[0006] Load the low-code template into the application's original code file;

[0007] Running the low-code template displays a visual editing interface;

[0008] In response to page editing operations in the visual editing interface, page data for the newly added page of the application is generated.

[0009] Secondly, embodiments of this application provide a page generation apparatus, comprising:

[0010] Loading unit, used to load low-code templates into the application's source code files;

[0011] The display unit is used to run the low-code template and display a visual editing interface;

[0012] The determining unit is used to respond to page editing operations in the visual editing interface and generate page data for the new page of the application.

[0013] Thirdly, embodiments of this application provide an electronic device, including:

[0014] processor;

[0015] Memory used to store the processor's executable instructions;

[0016] The processor is configured to execute the instructions to implement the page generation method as described in the first aspect.

[0017] Fourthly, embodiments of this application provide a computer-readable storage medium that, when the instructions in the storage medium are executed by a processor of an electronic device, enables the electronic device to perform the page generation method as described in the first aspect.

[0018] Fifthly, embodiments of this application provide a computer program product, the computer program product including a non-transitory computer-readable storage medium storing a computer program operable to cause a computer to perform some or all of the steps in the page generation method as described in the first aspect.

[0019] The above-described technical solutions adopted in the embodiments of this application can achieve the following beneficial effects:

[0020] Low-code templates enabling visual data editing are loaded into the application's source code files, giving them low-code capabilities. Running the low-code templates within the source code files displays a visual editing interface, allowing developers to create pages based on iterative needs, replacing the traditional method of writing code. Responding to page editing operations in the visual interface generates page data for newly added pages, meeting iterative development requirements. Because the page data is newly created, rather than modified from existing pages, this satisfies update and iteration needs without damaging the original code files, preserving the usability of existing application pages. Therefore, the development process for new page data utilizes the low-code technology provided by low-code templates, eliminating the need for extensive coding and repetitive work, thus reducing workload, the probability of errors, and improving iteration efficiency. Attached Figure Description

[0021] The accompanying drawings, which are included to provide a further understanding of this application and form part of this application, illustrate exemplary embodiments and are used to explain this application, but do not constitute an undue limitation of this application. In the drawings:

[0022] Figure 1 A flowchart illustrating a page generation method provided in one embodiment of this application;

[0023] Figure 2 A flowchart illustrating a page generation method provided for another embodiment of this application;

[0024] Figure 3 A schematic diagram of a visual management interface provided for one embodiment of this application;

[0025] Figure 4 A schematic diagram of a visual management interface provided for another embodiment of this application;

[0026] Figure 5 A schematic diagram of a visual editing interface provided for one embodiment of this application;

[0027] Figure 6 A schematic diagram of the structure of a page generation apparatus provided in one embodiment of this application;

[0028] Figure 7 This is a schematic diagram of the structure of an electronic device provided in one embodiment of this application. Detailed Implementation

[0029] To make the objectives, technical solutions, and advantages of this application clearer, the technical solutions of this application will be clearly and completely described below in conjunction with specific embodiments and corresponding drawings. Obviously, the described embodiments are only a part of the embodiments of this application, and not all of them. Based on the embodiments in this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.

[0030] The terms "first," "second," etc., used in this specification and claims are used to distinguish similar objects and not to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that embodiments of this application can be implemented in orders other than those illustrated or described herein. Furthermore, in this specification and claims, "and / or" indicates at least one of the connected objects, and the character " / " generally indicates that the preceding and following objects are in an "or" relationship.

[0031] Explanation of some concepts:

[0032] Low-code is a visual application development approach that delivers applications with less code and faster speed, automating code that you don't want to develop.

[0033] In related technologies, each iteration of an application's pages involves a series of operations such as requirement design, code writing, review, scheduling, and testing. This results in many repetitive operations and the writing of large amounts of duplicate code, which not only affects the normal operation of the pages but also increases workload and reduces iteration efficiency.

[0034] Furthermore, research into related technologies reveals that low-code techniques utilize low-code development platforms. A new project is created within the platform, and the application's original code files are imported into this project to visually display the application's existing pages. These pages are then updated and iterated through visual editing. However, this method modifies the original page's code, potentially corrupting the application's original code files and rendering the original page's functionality unusable, thus affecting its normal operation.

[0035] This application proposes a page generation method that loads a low-code template enabling visual data editing into the application's original code file, thus endowing the original code file with low-code capabilities. By running the low-code template, a visual editing interface is displayed, allowing developers to create pages according to iterative needs, replacing the method of writing code to develop pages. Responding to page editing operations in the visual editing interface, page data for newly added pages in the application is generated to meet iterative development requirements. Because the page data is newly created, rather than modified from existing pages, this method satisfies update and iteration needs without damaging the original code file, preserving the usability of the application's original pages.

[0036] It should be understood that the page generation method provided in this application embodiment can be executed by an electronic device. The electronic device referred to herein may include terminal devices, such as smartphones, tablets, laptops, desktop computers, smart voice interaction devices, smart home appliances, smartwatches, vehicle terminals, aircraft, etc.; or, the electronic device may also include a server, such as a standalone physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server providing cloud computing services. The electronic device is independent of the backend server.

[0037] The technical solutions provided by the various embodiments of this application are described in detail below with reference to the accompanying drawings.

[0038] Please see Figure 1 The following is a flowchart illustrating a page generation method according to an embodiment of this application. The method includes the following steps:

[0039] S102 loads the low-code template into the application's source code file.

[0040] The application can be various front-end applications, such as B2B applications, etc., and this application embodiment does not limit this. The original code file is a pre-written project file for the application, which contains the code, resources, and parameters required to run the application. The page generation method provided in this application embodiment is applicable to original code files written in various programming frameworks, such as including but not limited to VUE2, VUE3, and other JavaScript frameworks, and this application embodiment does not limit this.

[0041] Low-code templates contain pre-written code that enables low-code functionality. Low-code templates allow for visual editing of data. By loading a low-code template into the application's source code files, the application's source code files gain low-code capabilities, meaning that new functionality can be added to the source code files through visual editing.

[0042] In one embodiment, since the low-code template and the original code file are different files, in order to effectively add noise to the original code file without damaging the original code file, the above S102 may include the following steps: importing the code adding plugin into the original code file, and running the code adding plugin to copy the low-code template as a sub-file into the original code file.

[0043] The code-adding plugin is a pre-written plugin used to add external files. In this embodiment, the code-adding plugin is used to add external low-code files to the original code file. In practice, the code-adding plugin can be imported into the original code file using the import statement in the compiler, and then the code-adding plugin can be run in the compiler to copy the low-code template into the original code file as a sub-file.

[0044] For example, such as Figure 2 As shown, the original code file includes subfile 1 and subfile 2. By running the code to add a plugin, the low-code template is converted into subfile 3 and added to the original code file.

[0045] In another implementation, the original code file can be imported into a project management tool (such as Apache Maven, Gradle, etc.), and a sub-file can be added to the original code file through the project management tool. Then, the low-code template can be copied as the content of the sub-file to the sub-file, thus loading the low-code template into the original code file.

[0046] This application embodiment illustrates a partial implementation of S102 described above. It should be understood that S102 can also be implemented in other ways, and this application embodiment does not limit this implementation.

[0047] S104 runs a low-code template to display a visual editing interface.

[0048] The visual editing interface provides visual editing capabilities for pages, allowing developers to edit pages to meet iteration requirements directly within the interface without rewriting code or modifying existing code, thus enabling low-code development. By using the visual editing interface, new pages with new functionality can be added to the application, allowing them to coexist with existing pages. This preserves the original code files, maintains the application's existing pages and functionality, and enables page updates and iterations.

[0049] In one embodiment, S104 may include the following steps: S141, running a low-code template in the original code file to generate a visual management interface; S142, responding to the identifier display operation in the visual management interface and displaying a page identifier in the visual management interface; S143, responding to the page identifier's edit trigger operation and displaying a visual editing interface.

[0050] The visual management interface provides unified management of application pages. Through this interface, users can perform operations such as querying, creating, editing, previewing, launching, iterating, taking offline, and deprecating pages. Querying refers to finding existing pages in the application that meet specific search criteria. Creating a new page means creating a new page for the application. Editing allows for visual editing of application pages, such as adding new features or deleting existing features. Previewing displays the page. Launching the page allows external developers to access it. Iterating a page from the current version to a new version when new features are added; the current and new versions share the same page identifier, but their page sequence numbers (i.e., page IDs) are different. Taking the page offline prevents external developers from accessing it. Deprecating the page only allows previewing, but does not allow rollback, iteration, or other similar operations.

[0051] The identifier display function is used to add page identifiers in the visual management interface to enable unified management of the pages identified by those identifiers. Page identifiers can include, but are not limited to, page keys.

[0052] As an example, the identification display operation includes querying the page identifiers of existing pages in the application, and the visual management interface includes a query control. In this case, S142 above includes the following steps: responding to the query conditions of the query control, determining the first page identifier that meets the query conditions from the page identifiers of existing pages in the application; and displaying the first page identifier in the visual management interface. The query conditions may include, for example, one or more of the following: page identifier, page sequence number (i.e., page ID), page name, status, operator, etc.

[0053] For example, Figure 3 A schematic diagram of a visual management interface is shown. The interface also includes input boxes for entering query conditions, including text boxes for entering page keys, page names, page status selection, and user input. Developers can enter query conditions through these input boxes and click the query control to identify existing pages in the application that meet the query conditions. Responding to the query control's trigger operation, the interface determines that the page identifier of existing page 1 in the application meets the query conditions. It then uses the existing page identifier of page 1 as the identifier for a new page, displays the page identifier, page name, and status of existing page 1 in the visual management interface, configures a new page ID for the page, sets the version number to V2, and displays operation options for existing page 1, including edit, preview, launch, iterate, delaunch, and obsolescence. In this way, developers can click the edit option to display the visual editing interface of the existing page 1. Using the low-code editing function provided by the visual editing interface, the newly added page can coexist with the existing page 1 according to the update and iteration requirements, and has been updated and iterated compared to the existing page 1. Thus, the update and iteration of the existing page 1 can be achieved without affecting the existing page 1.

[0054] This implementation method allows for the addition of new pages that meet the needs of updates and iterations in the application, and these new pages can coexist with existing pages, thus enabling the updates and iterations of existing pages without affecting them.

[0055] It is worth noting that in the above implementation, to ensure that both existing and newly added pages can be accessed and to avoid confusion between them, existing and newly added pages can share the same page identifier, but their page IDs are different. That is, if the page identifier of an existing page that meets the query conditions is used as the page identifier of a newly added page, a new page ID is automatically assigned to the newly added page. In this way, both existing and newly added pages can be accessed through the page identifier, but only newly added pages can be accessed through the page ID.

[0056] As another example, the identifier display operation includes adding a new page identifier, and the visual management interface includes a newly created control. In this case, S142 above includes the following steps: receiving the second page identifier of the newly created control; and displaying the second page identifier in the visual management interface.

[0057] For example, Figure 4 A schematic diagram of another visual management interface is shown. This interface also includes input boxes for entering query criteria, including text boxes for entering page keys, page names, page status selection, and operator information. Developers can input the page identifier, page name, page status, operator, etc., of a new page through these input boxes and click "Create New Control." In response to the creation of the new control, the visual management interface displays the above information for the new page, assigns a new page ID, sets the version number of the new page to V1, and displays operation options for manipulating the new page, including edit, preview, launch, iterate, delaunch, and obsolescence. Thus, developers can click the edit option to display the visual editing interface for the new page, and use the low-code editing capabilities provided by the visual editing interface to edit the new page according to update and iteration needs, generating page data for the new page.

[0058] This implementation method allows for the addition of new pages that meet the needs of updates and iterations in the application, and these new pages can coexist with existing pages, thus enabling the updates and iterations of existing pages without affecting them.

[0059] This application embodiment illustrates a partial implementation of S1014 described above. Of course, it should be understood that S104 can also be implemented in other ways, and this application embodiment does not limit this. For example, in another embodiment, after running the low-code template, a visual editing interface is directly displayed. In the visual editing interface, basic page data such as the page identifier, page ID, page name, status, and version number of the newly added page are configured, and the page content data of the newly added page is edited in the visual editing interface. Then, based on the basic page data and page content data of the newly added page, page data for the newly added page is generated.

[0060] S106, in response to the page editing operation in the visual editing interface, generate page data for the new page of the application.

[0061] The new page includes features to meet the needs of iteration.

[0062] Developers can use the visual editing interface to customize newly added pages, including but not limited to editing the size, style, and content of the new pages. The page data of the new page is used to render the new page when the original code file is run. The page data can include, but is not limited to, Vue files, CSS (Cascading Style Sheets) files, and resource files.

[0063] In one embodiment, the visual editing interface includes a preview area and a configuration area, and the page editing operation includes adding page components and configuring page components. In this case, the above-described S106 may include the following steps: adding a target page component in the preview area and displaying a configuration control for the target page component in the configuration area; responding to the component configuration operation of the configuration control and determining the component attribute data of the target page component; and generating page data for the newly added page of the application based on the target page component and the component attribute data.

[0064] For example, such as Figure 5 As shown, in response to selection operations on the page component set, such as dragging, entering commands, or clicking, the selected page component 1 and page component 2 from the page component set are added to the preview area as target page components. The page component set includes multiple pre-developed page components. After page component 1 is selected in the preview area, configuration controls for page component 1 are displayed in the configuration area. These configuration controls are used to configure the component properties of page component 1, such as, but not limited to, page component 1's color, font size, page component size, minimum scaling size, and maximum scaling size. Configuration controls can be, for example, but not limited to, at least one of the following controls: buttons, text boxes, radio buttons, dropdown lists, tables, tree controls, image controls, text upload controls, and layout controls.

[0065] After configuring the target page components using the configuration controls, the target page components in the preview area can be synchronously updated based on the configured component attribute data to visualize the configuration effect and facilitate modifications by developers. Finally, based on the component attribute data of the target page components in the preview area, the page data for the newly added page is generated.

[0066] In this embodiment, the visual editing interface displays the page in sections. The preview area allows for a visual display of the page style, size, and content of the newly added page, while the configuration area allows for visual editing of the page components in the newly added page. This enables rapid page updates and iterations without the need for rewriting or testing multiple parts of the code, making it more flexible and simple to implement and improving the efficiency of page data generation.

[0067] This application embodiment illustrates a partial implementation of S106 described above. Of course, it should be understood that S106 can also be implemented in other ways, and this application embodiment does not limit this. For example, the visual editing interface does not display in sections; developers can directly add target page components to the visual editing interface, and perform operations such as moving, scaling, and text input on the page components in the visual editing interface to edit the component attributes of the target page components. Then, based on the edited target page components and their component attribute data, page data for a new page is generated.

[0068] In another embodiment of this application, the page generation method described above may further include the following steps:

[0069] S108, register the routing information of the page data of the newly added page into the original code file.

[0070] After registering the routing information of the new page's page data into the original code file, the new page's page data can be obtained based on the routing information during the application's execution based on the original code file, and then the new page can be rendered based on the page data.

[0071] In one embodiment, to ensure the correct rendering of newly added pages, S108 may include the following steps: importing a routing toolkit into the source code file; running the routing toolkit to obtain routing information for the page data; and registering the routing information for the page data into the routing information of the source code file. The routing toolkit is a pre-written plugin for registering routing information. In this embodiment, the routing toolkit is used to add externally located page data routing information to the source code file. Specifically, the routing toolkit can be imported into the source code file using an import statement in the compiler, and then the code can be run in the compiler to add the plugin, thus registering the page data routing information into the routing information of the source code file.

[0072] For example, such as Figure 2 As shown, the original code file records the application's routing information. By running a routing toolkit, the routing information for page data is retrieved from the database and integrated into the application's routing information. The database stores the page data and routing information for all pages in the application. Thus, during application runtime, the routing information for newly added pages can be retrieved from the application's routing information, allowing the page data to be obtained and then rendered based on that data.

[0073] This application embodiment illustrates a partial implementation of S108 described above. It should be understood that S108 can also be implemented in other ways, and this application embodiment does not limit this implementation. For example, in another embodiment, the routing information for page data can be directly written in the application's routing information.

[0074] In another embodiment, after completing the editing operation of the newly added page through S102 to S108, the newly added page can also be previewed so that developers can modify it to better meet the needs of updates and iterations. Specifically, when the page identifier is displayed through a visual management interface, after S108, the page generation method provided in this application embodiment may further include: responding to the preview trigger operation of the page identifier to obtain routing information of the page data of the newly added page; encapsulating the embedded framework component into the routing information; running the embedded framework component to obtain the page data of the newly added page based on the routing information; and displaying the newly added page based on the page data.

[0075] Preview trigger actions can be entered in various ways. For example, using... Figure 4 Taking the visual management interface shown as an example, you can click the "Preview" option and enter the preview trigger operation for page identifier test2 to trigger the new page identified by page identifier test2.

[0076] Embedded frames can be of various types that allow external pages to be embedded into a visual management interface. As an example, an iframe is an embedded frame component. Unlike traditional frames used to create webpage structures, iframes can be inserted anywhere in the page layout. By encapsulating the iframe as the content of routing information within the routing information, running the iframe allows the page data to be retrieved using the routing information. This data is then used to dynamically render new pages, thus enabling a preview of the new pages.

[0077] In another embodiment, after completing the editing operation of the newly added page through S102 to S108, the state of the newly added page can also be modified, specifically including but not limited to online, iterated, offline, and obsolete, thereby achieving flexible control over the newly added page. Specifically, when the page identifier is displayed through a visual management interface, after S108, the page generation method provided in this application embodiment may further include: responding to the modification trigger operation of the page identifier, obtaining the routing information of the page data of the newly added page; and modifying the state of the page data based on the routing information.

[0078] For example, with Figure 3Taking the aforementioned visual management interface as an example, developers can click the "Go Online" option to input the go online trigger operation for the page identifier test1. In response to the go online trigger operation, the system obtains the routing information of the newly added page identified by test1, accesses the database based on this routing information, and modifies the status of the newly added page data in the database to "Go Online," thus allowing the rendering of the new page based on this data.

[0079] For example, a developer can click the "Online" option to trigger an offline action for the page identifier "test1". In response to this offline action, the system retrieves the routing information for the newly added page identified by "test1", accesses the database based on this routing information, and modifies the status of the newly added page's data in the database to "offline", meaning that rendering the new page based on this data is no longer allowed.

[0080] For example, developers can trigger an iteration operation for the page identifier "test1" by clicking the "Iterate" option. In response to the iteration trigger operation, the system retrieves the routing information for the newly added page identified by "test1," accesses the database based on this routing information, and modifies the status of the page data for that newly added page in the database to "Iterated." That is, when a request to access an existing page corresponding to "test1" is received, the system renders the newly added page based on the page data of the page identified by "test1," instead of rendering the existing page corresponding to "test1."

[0081] For example, developers can trigger the obsolescence of page identifier "test1" by clicking the "Obsolution" option. In response to the obsolescence trigger, the system retrieves the routing information for the new page identified by "test1," accesses the database based on this routing information, and modifies the status of the new page's data in the database to obsolescence. This means that only previewing the new page is allowed, while operations such as rollback, iteration, taking it offline, and bringing it back online are not permitted. The page generation method provided in this embodiment allows for flexible control over the online, iteration, offline, and obsolescence of edited new pages, meeting diverse page generation needs.

[0082] One or more embodiments of this application provide a page generation method that loads a low-code template capable of visual data editing into the original code file of an application, thereby endowing the original code file with low-code capabilities. By running the low-code template within the original code file, a visual editing interface is displayed, allowing developers to create pages according to iterative needs, replacing the method of developing pages through code. In response to page editing operations in the visual editing interface, page data for newly added pages in the application is generated to meet iterative development requirements. Since the page data is newly created, rather than modified from existing pages, this satisfies update and iteration needs without damaging the original code file, preserving the usability of the application's original pages.

[0083] The foregoing has described specific embodiments of this specification. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps recited in the claims may be performed in a different order than that shown in the embodiments and may still achieve the desired result. Furthermore, the processes depicted in the drawings do not necessarily require the specific or sequential order shown to achieve the desired result. In some embodiments, multitasking and parallel processing are possible or may be advantageous.

[0084] Figure 6 This is a schematic diagram of the structure of a page generation apparatus provided in one embodiment of this application. Please refer to... Figure 6 In one software implementation, the page generation device 600 may include a loading unit 610, a display unit 620, a determining unit 630, and a registration unit 640.

[0085] Loading unit 610 is used to load low-code templates into the application's source code files.

[0086] Display unit 620 is used to run the low-code template and display a visual editing interface.

[0087] The determining unit 630 is used to respond to the page editing operation in the visual editing interface and generate page data for the new page of the application.

[0088] In another embodiment, the device further includes:

[0089] The registration unit is used to register the routing information of the page data into the original code file.

[0090] In another embodiment, the loading unit is used for:

[0091] Import the code into the original code file to add the plugin;

[0092] Run the code to add the plugin, and copy the low-code template as a subfile into the original code file.

[0093] In another embodiment, the display unit is used for:

[0094] Run the low-code template to generate a visual management interface;

[0095] In response to the icon display operation in the visual management interface, display the page icon in the visual management interface;

[0096] In response to the edit trigger operation of the page identifier, the visual editing interface is displayed.

[0097] In another embodiment, the identifier display operation includes querying the page identifier of an existing page of the application, and the visual management interface includes a query control;

[0098] When the display unit responds to the identifier display operation in the visual management interface and displays the page identifier in the visual management interface, it performs the following steps:

[0099] In response to the query conditions of the query control, a first page identifier that meets the query conditions is determined from the page identifiers of the existing pages of the application;

[0100] The first page identifier is displayed in the visual management interface.

[0101] In another embodiment, the identifier display operation includes adding a new page identifier, and the visual management interface includes a new control;

[0102] When the display unit responds to the identifier display operation in the visual management interface and displays the page identifier in the visual management interface, it performs the following steps:

[0103] Receive the second page identifier of the newly created control;

[0104] The second page identifier is displayed in the visual management interface.

[0105] In another embodiment, the page generation apparatus further includes:

[0106] The first acquisition unit is used to respond to the preview trigger operation of the page identifier and acquire the routing information of the page data;

[0107] An encapsulation unit is used to encapsulate embedded framework components into the routing information;

[0108] The running unit is used to run the embedded framework component, obtain the page data based on the routing information, obtain the page data based on the routing information, and display the newly added page based on the page data.

[0109] In another embodiment, the page generation apparatus further includes:

[0110] The second acquisition unit is used to acquire the routing information of the page data in response to the modification trigger operation of the page identifier;

[0111] The modification unit is used to modify the state of the page data based on the routing information.

[0112] In another embodiment, the page editing operation includes adding page components and configuring the page components, and the visual editing interface includes a preview area and a configuration area;

[0113] The determining unit is used for:

[0114] Add the target page component to the preview area;

[0115] The configuration controls for the target page component are displayed in the configuration area;

[0116] In response to the component configuration operation of the configuration control, determine the component attribute data of the target page component;

[0117] Based on the target page component and the component attribute data, generate page data for the new page of the application.

[0118] In another embodiment, the registration unit is used for:

[0119] Import the routing toolkit into the original code file;

[0120] Run the routing toolkit to obtain the routing information of the page data, and register the routing information of the page data into the routing information of the original code file.

[0121] Obviously, the page generation apparatus provided in this application embodiment can serve as... Figure 1 The execution body of the page generation method shown, for example Figure 1 In the page generation method shown, step S102 can be performed by... Figure 6 The loading unit 610 in the page generation device shown executes step S104, which can be performed by... Figure 6 The display unit 620 in the page generation device shown executes step S106, which can be performed by... Figure 6 The determination unit 630 in the page generation apparatus shown is executed.

[0122] According to another embodiment of this application, Figure 6 The modules in the page generation apparatus shown can be individually or entirely merged into one or more other modules, or some of the modules can be further divided into multiple functionally smaller modules. This achieves the same operation without affecting the technical effects of the embodiments of this application. The above modules are based on logical function division. In practical applications, the function of one module can be implemented by multiple modules, or the function of multiple modules can be implemented by one module. In the embodiments of this application, the page generation apparatus may also include other modules. In practical applications, these functions can also be implemented with the assistance of other modules, and can be implemented collaboratively by multiple modules.

[0123] According to another embodiment of this application, a general-purpose computing device, such as a computer, including processing elements and storage elements such as a central processing unit (CPU), random access memory (RAM), and read-only memory (ROM), can run an application capable of performing tasks such as... Figure 1 The computer program (including program code) for each step involved in the corresponding method shown, to construct such... Figure 6 The page generation apparatus shown herein, and the page generation method for implementing the embodiments of this application, are described. The computer program may be recorded on, for example, a computer-readable storage medium, and may be transferred to and run in an electronic device via such a medium.

[0124] Figure 7 This is a schematic diagram of the structure of an electronic device according to an embodiment of this application. Please refer to it. Figure 7 At the hardware level, the electronic device includes a processor, and optionally also includes an internal bus, a network interface, and memory. The memory may include main memory, such as high-speed random-access memory (RAM), or non-volatile memory, such as at least one disk drive. Of course, the electronic device may also include other hardware required for other business operations.

[0125] The processor, network interface, and memory can be interconnected via an internal bus, which can be an ISA (Industry Standard Architecture) bus, a PCI (Peripheral Component Interconnect) bus, or an EISA (Extended Industry Standard Architecture) bus, etc. This bus can be divided into address bus, data bus, control bus, etc. For ease of representation, Figure 7 The symbol is represented by a single double-headed arrow, but this does not mean that there is only one bus or one type of bus.

[0126] Memory is used to store programs. Specifically, programs may include program code, which includes computer operation instructions. Memory may include main memory and non-volatile memory, and provides instructions and data to the processor.

[0127] The processor reads the corresponding computer program from non-volatile memory into main memory and then runs it, forming a page generation mechanism at the logical level. The processor executes the program stored in memory and specifically performs the following operations:

[0128] Load the low-code template into the application's original code file;

[0129] Running the low-code template displays a visual editing interface;

[0130] In response to page editing operations in the visual editing interface, page data for the newly added page of the application is generated.

[0131] The above is as stated in this application. Figure 1The page generation apparatus disclosed in the illustrated embodiments can be applied to a processor or implemented by a processor. The processor may be an integrated circuit chip with signal processing capabilities. During implementation, each step of the above method can be completed by integrated logic circuits in the processor's hardware or by instructions in software form. The processor can be a general-purpose processor, including a Central Processing Unit (CPU), a Network Processor (NP), etc.; it can also be a Digital Signal Processor (DSP), an Application Specific Integrated Circuit (ASIC), a Field-Programmable Gate Array (FPGA), or other programmable logic devices, discrete gate or transistor logic devices, or discrete hardware components. It can implement or execute the methods, steps, and logic block diagrams disclosed in the embodiments of this application. The general-purpose processor can be a microprocessor or any conventional processor. The steps of the methods disclosed in the embodiments of this application can be directly embodied in the execution of a hardware decoding processor, or executed by a combination of hardware and software modules in the decoding processor. The software module can reside in a mature storage medium in the field, such as random access memory, flash memory, read-only memory, programmable read-only memory, electrically erasable programmable memory, or registers. This storage medium is located in memory, and the processor reads information from the memory and, in conjunction with its hardware, completes the steps of the above method.

[0132] The electronic device can also perform Figure 1 The method, and implement the page generation device in Figure 1 , Figure 2 The functions of the embodiments shown are not described in detail here.

[0133] Of course, in addition to software implementation, the electronic device of this application does not exclude other implementation methods, such as logic devices or a combination of hardware and software, etc. In other words, the execution subject of the following processing flow is not limited to each logic unit, but can also be hardware or logic devices.

[0134] This application also proposes a computer-readable storage medium that stores one or more programs, the programs including instructions that, when executed by a portable electronic device including multiple applications, enable the portable electronic device to perform... Figure 1 The method of the illustrated embodiment is specifically used to perform the following operations:

[0135] Load the low-code template into the application's original code file;

[0136] Running the low-code template displays a visual editing interface;

[0137] In response to page editing operations in the visual editing interface, page data for the newly added page of the application is generated.

[0138] This application also provides a computer program product, which includes a non-transitory computer-readable storage medium storing a computer program operable to cause a computer to perform some or all of the steps in the page generation method provided in this application.

[0139] In summary, the above description is merely a preferred embodiment of this application and is not intended to limit the scope of protection of this application. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of this application should be included within the scope of protection of this application.

[0140] The systems, devices, modules, or units described in the above embodiments can be implemented by computer chips or entities, or by products with certain functions. A typical implementation device is a computer. Specifically, a computer can be, for example, a personal computer, laptop computer, cellular phone, camera phone, smartphone, personal digital assistant, media player, navigation device, email device, game console, tablet computer, wearable device, or any combination of these devices.

[0141] Computer-readable media includes both permanent and non-permanent, removable and non-removable media that can store information using any method or technology. Information can be computer-readable instructions, data structures, modules of programs, or other data. Examples of computer storage media include, but are not limited to, phase-change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technologies, CD-ROM, digital versatile optical disc (DVD) or other optical storage, magnetic tape, magnetic disk storage or other magnetic storage devices, or any other non-transferable medium that can be used to store information accessible by a computing device. As defined herein, computer-readable media does not include transient computer-readable media, such as modulated data signals and carrier waves.

[0142] It should also be noted that the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitation, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes said element.

[0143] The various embodiments in this specification are described in a progressive manner. Similar or identical parts between embodiments can be referred to interchangeably. Each embodiment focuses on describing the differences from other embodiments. In particular, the system embodiments are basically similar to the method embodiments, so the description is relatively simple; relevant parts can be referred to the descriptions in the method embodiments.

Claims

1. A page generation method, characterized in that, include: Load the low-code template into the application's original code file; Running the low-code template displays a visual editing interface; In response to page editing operations in the visual editing interface, page data for the newly added page of the application is generated.

2. The method according to claim 1, characterized in that, The method also includes registering the routing information of the page data into the original code file.

3. The method according to claim 1, characterized in that, The step of loading the low-code template into the application's original code file includes: Import the code into the original code file to add the plugin; Run the code to add the plugin, and copy the low-code template as a subfile into the original code file.

4. The method according to claim 1, characterized in that, Running the low-code template and displaying the visual editing interface includes: Run the low-code template to generate a visual management interface; In response to the icon display operation in the visual management interface, display the page icon in the visual management interface; In response to the edit trigger operation of the page identifier, the visual editing interface is displayed.

5. The method according to claim 4, characterized in that, The identification display operation includes querying the page identification of existing pages in the application, and the visual management interface includes a query control; The step of responding to the identifier display operation in the visual management interface and displaying the page identifier in the visual management interface includes: In response to the query conditions of the query control, a first page identifier that meets the query conditions is determined from the page identifiers of the existing pages of the application; The first page identifier is displayed in the visual management interface.

6. The method according to claim 4, characterized in that, The identifier display operation includes adding a new page identifier, and the visual management interface includes creating a new control; The step of responding to the identifier display operation in the visual management interface and displaying the page identifier in the visual management interface includes: Receive the second page identifier of the newly created control; The second page identifier is displayed in the visual management interface.

7. The method according to claim 4, characterized in that, After generating page data for the new page of the application in response to a page editing operation in the visual editing interface, the method further includes: In response to the preview trigger operation of the page identifier, obtain the routing information of the page data; The embedded framework components are encapsulated into the routing information; The embedded framework component is run to obtain the page data based on the routing information, and the newly added page is displayed based on the page data.

8. The method according to claim 4, characterized in that, After generating page data for the new page of the application in response to a page editing operation in the visual editing interface, the method further includes: In response to the modification trigger operation of the page identifier, obtain the routing information of the page data; Based on the routing information, the state of the page data is modified.

9. The method according to claim 1, characterized in that, The page editing operation includes adding page components and configuring the page components; the visual editing interface includes a preview area and a configuration area. The step of generating page data for a new page in the application in response to a page editing operation in the visual editing interface includes: Add the target page component to the preview area; The configuration controls for the target page component are displayed in the configuration area; In response to the component configuration operation of the configuration control, determine the component attribute data of the target page component; Based on the target page component and the component attribute data, generate page data for the new page of the application.

10. The method according to claim 2, characterized in that, The step of registering the routing information of the page data to the original code file includes: Import the routing toolkit into the original code file; Run the routing toolkit to obtain the routing information of the page data, and register the routing information of the page data into the routing information of the original code file.

11. A page generation apparatus, characterized in that, include: Loading unit, used to load low-code templates into the application's source code files; The display unit is used to run the low-code template and display a visual editing interface; The determining unit is used to respond to page editing operations in the visual editing interface and generate page data for the new page of the application.

12. An electronic device, characterized in that, include: processor; Memory used to store the processor's executable instructions; The processor is configured to execute the instructions to implement the page generation method as described in any one of claims 1 to 10.

13. A computer-readable storage medium, characterized in that, When the instructions in the storage medium are executed by the processor of the electronic device, the electronic device is able to perform the page generation method as described in any one of claims 1 to 10.

14. A computer program product, characterized in that, The computer program product includes a non-transitory computer-readable storage medium storing a computer program operable to cause a computer to perform some or all of the steps in the page generation method as claimed in any one of claims 1 to 10.

Images