CN115495178A - Screen display method based on micro front-end framework and related equipment - Google Patents

Screen display method based on micro front-end framework and related equipment Download PDF

Info

Publication number
CN115495178A
CN115495178A CN202210895309.6A CN202210895309A CN115495178A CN 115495178 A CN115495178 A CN 115495178A CN 202210895309 A CN202210895309 A CN 202210895309A CN 115495178 A CN115495178 A CN 115495178A
Authority
CN
China
Prior art keywords
sub
application
display
micro
chart
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202210895309.6A
Other languages
Chinese (zh)
Inventor
陈银伟
范永学
韩东兴
杨宇
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
State Grid Information and Telecommunication Co Ltd
Beijing Guodiantong Network Technology Co Ltd
Original Assignee
State Grid Information and Telecommunication Co Ltd
Beijing Guodiantong Network Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by State Grid Information and Telecommunication Co Ltd, Beijing Guodiantong Network Technology Co Ltd filed Critical State Grid Information and Telecommunication Co Ltd
Priority to CN202210895309.6A priority Critical patent/CN115495178A/en
Publication of CN115495178A publication Critical patent/CN115495178A/en
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements 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/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements 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/44Arrangements for executing specific programs
    • G06F9/445Program loading or initiating
    • G06F9/44521Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

The application provides a screen display method based on a micro front-end frame and related equipment, wherein the method comprises the following steps: constructing a micro front end framework, wherein the micro front end framework comprises a plurality of sub-applications; constructing a display page, wherein the display page comprises a plurality of sub-areas; each subarea is provided with a calling interface, and the sub application is loaded into the subarea through the calling interface; wherein, the sub-applications correspond to the sub-regions one by one; and each sub-application acquires a corresponding display chart from the open-source visual chart library and displays the display chart in the corresponding sub-area. By the method, the display of later-stage expansion business is supported, and the maintenance and the popularization are convenient.

Description

Screen display method based on micro front-end framework and related equipment
Technical Field
The application relates to the technical field of screen display, in particular to a screen display method based on a micro front-end frame and related equipment.
Background
During engineering construction or project operation, personnel are needed to monitor project progress or key elements, in order to facilitate the monitoring of the personnel, the project progress and the key elements which need to be monitored are integrated on the same display page, and the display page is displayed on a large display screen.
The existing large-screen display page is directionally developed according to user business and screen size, then the directionally developed large-screen display page is displayed on a large screen, after the user business is expanded in the later period, the large screen cannot display the expanded business in the later period, and meanwhile, the directional development is not beneficial to later maintenance and popularization.
Disclosure of Invention
In view of the above, an object of the present application is to provide a micro front end frame-based screen display method and related apparatus, so as to solve or partially solve the above technical problems.
Based on the above purpose, the present application provides a screen display method based on a micro front end frame, including:
constructing a micro front-end framework, wherein the micro front-end framework comprises a plurality of sub-applications;
constructing a display page, wherein the display page comprises a plurality of sub-areas;
setting a calling interface for each sub-area, and loading the sub-application into the sub-area through the calling interface; the sub-applications correspond to the sub-regions one by one;
and each sub-application acquires a corresponding display chart from an open-source visual chart library and displays the display chart in the corresponding sub-area.
Optionally, the micro front-end framework further includes a main application, and the main application is configured to manage the plurality of sub-applications.
Optionally, the display page is composed of a page service frame and a component.
Optionally, before the sub-application is loaded into the sub-area through the call interface, the method includes: causing the child application to register within the micro front-end framework.
Optionally, the screen display method based on the micro front end frame further includes:
refreshing the presentation graph presented in the sub-region, including:
in response to receiving a refresh instruction, the sub-application sending the refresh instruction to the visual chart library;
the visual chart library generates an updated display chart according to the refreshing instruction, and sends the updated display chart to the sub-application;
and the sub-application displays the updated display chart in the corresponding sub-area.
Optionally, the display ratio of the display page is set through a configuration file based on the screen size.
Optionally, the screen display method based on the micro front end frame further includes:
and enabling each sub-application to acquire a corresponding real-time image from a pre-constructed database, and displaying the real-time image in the corresponding sub-area.
Based on the same inventive concept, the application also provides a screen display device based on the micro front end frame, which comprises:
a frame module configured to: constructing a micro front-end framework, wherein the micro front-end framework comprises a plurality of sub-applications;
a region module configured to: constructing a display page, wherein the display page comprises a plurality of sub-areas;
a loading module configured to: setting a calling interface for each sub-area, and loading the sub-application into the sub-area through the calling interface; wherein the sub-applications are in one-to-one correspondence with the sub-regions;
a presentation module configured to: and each sub-application acquires a corresponding display chart from an open-source visual chart library and displays the display chart in the corresponding sub-area.
Based on the same inventive concept, the present application further provides an electronic device comprising a memory, a processor and a computer program stored on the memory and executable by the processor, wherein the processor implements the method as described above when executing the computer program.
Based on the same inventive concept, the present application also provides a non-transitory computer-readable storage medium storing computer instructions for causing a computer to perform the method as described above.
From the above, it can be seen that the screen display method and the related device based on the micro front-end frame provided by the application construct the micro front-end frame, the micro front-end frame includes a plurality of sub-applications, and further construct the display page, the display page includes a plurality of sub-areas, each sub-area sets a call interface, the sub-applications are loaded into the sub-areas through the call interfaces, when the later service is expanded, a new sub-application is constructed according to the newly added service, the new sub-application is loaded in the sub-area to be displayed through the call interface of the sub-area to be displayed, the new sub-application obtains a corresponding display chart from the visual chart library of the opening source, the display chart is displayed in the sub-area to be displayed, the later expansion service display is realized, the code coupling is reduced by using the micro front-end frame, the later maintenance is convenient, and the method is suitable for various user service scenes and screen sizes, does not need to perform directional development, and is convenient for popularization and application.
Drawings
In order to more clearly illustrate the technical solutions in the present application or the related art, the drawings needed to be used in the description of the embodiments or the related art will be briefly introduced below, and it is obvious that the drawings in the following description are only embodiments of the present application, and it is obvious for those skilled in the art that other drawings can be obtained according to these drawings without creative efforts.
FIG. 1 is a flowchart of a micro front end framework based screen display method according to an embodiment of the present application;
FIG. 2 is a flow chart of a pair show chart refresh in an embodiment of the present application;
FIG. 3 is a block diagram of a micro front frame based screen display device according to an embodiment of the present application;
fig. 4 is a block diagram of an electronic device according to an embodiment of the present application.
Detailed Description
In order to make the objects, technical solutions and advantages of the present application more apparent, the present application is further described in detail below with reference to the accompanying drawings in combination with specific embodiments.
It should be noted that technical terms or scientific terms used in the embodiments of the present application should have a general meaning as understood by those having ordinary skill in the art to which the present application belongs, unless otherwise defined. The use of "first," "second," and similar terms in the embodiments of the present application is not intended to indicate any order, quantity, or importance, but rather is used to distinguish one element from another. The word "comprising" or "comprises", and the like, means that the element or item listed before the word covers the element or item listed after the word and its equivalents, but does not exclude other elements or items. The terms "connected" or "coupled" and the like are not restricted to physical or mechanical connections, but may include electrical connections, whether direct or indirect. "upper", "lower", "left", "right", and the like are used merely to indicate relative positional relationships, and when the absolute position of the object being described is changed, the relative positional relationships may also be changed accordingly.
The prior large-screen display page is directionally developed according to user business and field size, and then the directionally developed large-screen display page is displayed on a large screen, after the user business is expanded in the later period, the large screen cannot display the expanded business in the later period, and meanwhile, the directional development is not beneficial to later maintenance and popularization.
In order to solve the problems in the related technology, a micro front end frame is constructed, the micro front end frame comprises a plurality of sub-applications and a display page is also constructed, the display page comprises a plurality of sub-regions, each sub-region is provided with a calling interface, the sub-applications are loaded into the sub-regions through the calling interfaces, when the later service is expanded, a new sub-application is constructed according to the newly added service, the new sub-application is loaded into the sub-region to be displayed through the calling interface of the sub-region to be displayed, the new sub-application obtains a corresponding display chart from an open source visual chart library, the display chart is displayed in the sub-region to be displayed, the later expansion service display is achieved, meanwhile, the micro front end frame is used for reducing code coupling, the later maintenance is convenient, meanwhile, the method is suitable for various user service scenes and screen sizes, directional development is not needed, and the popularization and application are convenient.
Embodiments of the present application are described in detail below with reference to the accompanying drawings.
The application provides a screen display method based on a micro front end frame, which refers to fig. 1 and comprises the following steps:
step S100: constructing a micro front-end framework, wherein the micro front-end framework comprises a plurality of sub-applications;
illustratively, a micro front end framework can be constructed based on the qaankun, wherein the qaankun is a micro front end implementation library based on single-spa, a main application and a plurality of sub-applications are firstly created, the number of the sub-applications is matched with the number of services to be displayed, if the services are increased at the later stage, a new sub-application can be created, the qaankun is installed in the main application, a start method, a loadMicroApp method and a register MicroApp method in the qaankun are imported into an entry file of the main application, and a start method is called to start the qaankun to complete the establishment of the micro front end framework. The constructed micro front-end framework can enable different sub-applications to run independently, and the different sub-applications can display different types of content, such as charts, videos and the like.
Step S200: constructing a display page, wherein the display page comprises a plurality of sub-areas;
illustratively, a presentation page can be constructed and intuitively presented by using Vue2.6.10 and Element-UI2.13.2, wherein Vue is a set of progressive frames for constructing a user interface, element-UI is a component library encapsulated based on Vue, before Vue2.6.10 is used, a Node environment, a software package manager npm corresponding to the Node environment and a module packaging tool webpack need to be installed, then Vue-cli is installed to configure a Vue command environment generation project, an Element-UI2.13.2 component library is introduced into a project entry file main.js, a global configuration object can be introduced while the Element-UI2.13.2 component library is introduced, the global configuration object comprises a size field, the size field can be used for changing the default size of a component, and the display page is obtained by selecting an appropriate component from the Element-UI2.13.2 component library to adjust the size according to presentation requirements.
Step S300: each subarea is provided with a calling interface, and the sub application is loaded into the subarea through the calling interface; wherein, the sub-applications correspond to the sub-regions one by one;
the calling interface loads the sub-application into a specific sub-area through a LoadModule function, the LoadModule function comprises a parameter name and a moduleDir, the name represents the name of the sub-application to be called, the moduleDir represents a directory where a dos file or a dom file of the sub-application is located, the corresponding sub-application can be found through the name and the moduleDir, the found sub-application is loaded into the sub-area where the calling interface is located, and the parameter name and the moduleDir in the LoadModule function can be adjusted to find the corresponding sub-application and load the sub-application if the sub-application loaded in the sub-area is required to be changed in the later period.
Step S400: and each sub-application acquires a corresponding display chart from the open-source visual chart library and displays the display chart in the corresponding sub-area.
An open-source visual chart library can select echerts 4.2.1, data can be converted into various types of charts through the echerts 4.2.1, a sub-application can query the data in the database regularly and lead the data into the echerts 4.2.1 to obtain a display chart, and the sub-application displays the display chart in a sub-area corresponding to the sub-application after obtaining the display chart.
As an optional embodiment, the micro front-end framework further comprises a main application, and the main application is used for managing the plurality of sub-applications.
The main application can manage the life cycle of the sub-applications and the communication mechanism between the applications, wherein the communication between the applications is mainly the communication between the main application and the sub-applications, and the communication between the sub-applications needs to be transferred through the main application.
As an alternative embodiment, the presentation page is composed of a page service framework and components.
The page service frame should at least contain HTML (HyperText Markup Language), CSS (Cascading Style Sheets) and JavaScript, where HTML is a Markup Language that includes a series of tags. The document formats on the network can be unified through the tags, so that the scattered Internet resources are connected into a logic whole, the HTML text is a descriptive text consisting of HTML commands, and the HTML commands can explain characters, graphs, animations, sounds, tables, links and the like; the CSS is a computer language for expressing a file style such as HTML, and can statically modify a web page and dynamically format elements of the web page in accordance with various script languages.
The components of the display page are obtained from the Element-UI, and the development of interface elements such as windows, text boxes, buttons, menus and the like in the display page can be rapidly completed by using the components.
As an optional embodiment, before the loading the sub application into the sub area through the call interface, the method includes: the child application is registered in the micro front end framework.
In the entry file main.js, registering a sub application registration list subNavList in the index.js by using a register micro apps method, completing the registration of the sub application in the micro front-end framework, and viewing the information of the registered sub application, wherein the information of the sub application comprises: the name of the sub-application, the identification number of the sub-application and the state of the sub-application.
As an alternative embodiment, referring to fig. 2, further includes: refreshing a presentation graph presented in a sub-region, comprising:
step S510: in response to receiving the refresh command, the sub-application sends the refresh command to the visual chart library;
and buttons for interaction can be arranged on the sub-region for display, different buttons correspond to different functions, and when a user clicks the refreshing button, a refreshing instruction is triggered and transmitted to the visual chart library through the sub-application to perform refreshing operation.
Step S520: the visual chart library generates an updated display chart according to the refreshing instruction and sends the updated display chart to the sub-application;
the refreshing instruction changes the updating time of the data, when the refreshing instruction is not triggered, the sub-application acquires the data from the database at regular time and transmits the data to the visual chart library to generate a chart, after the refreshing instruction is received, the sub-application can directly acquire the latest data from the database and transmit the latest data to the visual chart library, and the visual chart library generates an updated display chart according to the latest data and transmits the updated display chart to the sub-application.
Step S530: and the sub-application displays the updated display chart in the corresponding sub-area.
The sub-applications are loaded in the specific sub-regions, and the sub-applications can be displayed in the corresponding sub-regions after receiving the updated display chart transmitted by the visual chart library.
As an alternative embodiment, the presentation ratio of the presentation page is set by a configuration file based on the screen size.
Exemplarily, the display proportion of the display page can be set in the configuration file diy.config to adapt to the actual display screen, so that a good visual effect is achieved, and the maintenance is facilitated.
As an optional embodiment, the method further includes: and each sub-application acquires a corresponding real-time image from a pre-constructed database and displays the real-time image in a corresponding sub-area.
The sub-regions can display real-time images besides the display chart, images shot by equipment such as a monitoring camera and the like can be backed up in a corresponding database in real time, and when the real-time images need to be displayed, the sub-application obtains the real-time images from the backup database and displays the real-time images in the corresponding sub-regions, so that the real-time monitoring on the key posts or the dangerous posts is achieved.
It should be noted that the method of the embodiment of the present application may be executed by a single device, such as a computer or a server. The method of the embodiment can also be applied to a distributed scene and is completed by the mutual cooperation of a plurality of devices. In such a distributed scenario, one of the multiple devices may only perform one or more steps of the method of the embodiment, and the multiple devices interact with each other to complete the method.
It should be noted that the above describes some embodiments of the present application. Other embodiments are within the scope of the following claims. In some cases, the actions or steps recited in the claims may be performed in a different order than in the embodiments described above and still achieve desirable results. In addition, the processes depicted in the accompanying figures do not necessarily require the particular order shown, or sequential order, to achieve desirable results. In some embodiments, multitasking and parallel processing may also be possible or may be advantageous.
Based on the same inventive concept, corresponding to any embodiment method, the application also provides a screen display device based on the micro front-end frame.
Referring to fig. 3, the micro front end frame based screen display device includes:
a frame module 11 configured to: constructing a micro front-end framework, wherein the micro front-end framework comprises a plurality of sub-applications;
a zone module 12 configured to: constructing a display page, wherein the display page comprises a plurality of sub-areas;
a loading module 13 configured to: setting a calling interface for each sub-area, and loading the sub-application into the sub-area through the calling interface; wherein the sub-applications are in one-to-one correspondence with the sub-regions;
a presentation module 14 configured to: and each sub-application acquires a corresponding display chart from an open-source visual chart library and displays the display chart in the corresponding sub-area.
As an optional embodiment, the micro front-end framework further comprises a master application for managing the plurality of sub-applications.
As an alternative embodiment, the presentation page is comprised of a page service framework and components.
As an optional embodiment, before the loading the sub-application into the sub-area through the call interface, the method includes: and enabling the sub-application to register in the micro front-end framework.
As an alternative embodiment, the method further comprises: refreshing the presentation graph presented within the sub-region, comprising:
in response to receiving a refresh instruction, the sub-application sending the refresh instruction to the visual chart library;
the visual chart library generates an updated display chart according to the refreshing instruction, and sends the updated display chart to the sub-application;
and the sub-application displays the updated display chart in the corresponding sub-area.
As an alternative embodiment, the presentation scale of the presentation page is set by a configuration file based on the screen size.
As an alternative embodiment, the method further comprises: and enabling each sub-application to acquire a corresponding real-time image from a pre-constructed database, and displaying the real-time image in the corresponding sub-area.
For convenience of description, the above devices are described as being divided into various modules by functions, which are described separately. Of course, the functionality of the various modules may be implemented in the same one or more software and/or hardware implementations as the present application.
The device of the above embodiment is used to implement the corresponding screen display method based on the micro front end frame in any of the foregoing embodiments, and has the beneficial effects of the corresponding method embodiment, which are not described herein again.
Based on the same inventive concept, corresponding to the method of any embodiment described above, the present application further provides an electronic device, which includes a memory, a processor, and a computer program stored in the memory and executable on the processor, and when the processor executes the program, the screen display method based on the micro front end framework described in any embodiment described above is implemented.
Fig. 4 is a schematic diagram illustrating a more specific hardware structure of an electronic device according to this embodiment, where the device may include: a processor 1010, a memory 1020, an input/output interface 1030, a communication interface 1040, and a bus 1050. Wherein the processor 1010, memory 1020, input/output interface 1030, and communication interface 1040 are communicatively coupled to each other within the device via bus 1050.
The processor 1010 may be implemented by a general-purpose CPU (Central Processing Unit), a microprocessor, an Application Specific Integrated Circuit (ASIC), or one or more Integrated circuits, and is configured to execute related programs to implement the technical solutions provided in the embodiments of the present disclosure.
The Memory 1020 may be implemented in the form of a ROM (Read Only Memory), a RAM (Random Access Memory), a static storage device, a dynamic storage device, or the like. The memory 1020 may store an operating system and other application programs, and when the technical solutions provided by the embodiments of the present specification are implemented by software or firmware, the relevant program codes are stored in the memory 1020 and called by the processor 1010 for execution.
The input/output interface 1030 is used for connecting an input/output module to input and output information. The i/o module may be configured as a component within the device (not shown) or may be external to the device to provide corresponding functionality. The input devices may include a keyboard, a mouse, a touch screen, a microphone, various sensors, etc., and the output devices may include a display, a speaker, a vibrator, an indicator light, etc.
The communication interface 1040 is used for connecting a communication module (not shown in the drawings) to implement communication interaction between the present apparatus and other apparatuses. The communication module can realize communication in a wired mode (such as USB, network cable and the like) and also can realize communication in a wireless mode (such as mobile network, WIFI, bluetooth and the like).
The bus 1050 includes a path to transfer information between various components of the device, such as the processor 1010, memory 1020, input/output interface 1030, and communication interface 1040.
It should be noted that although the above-mentioned device only shows the processor 1010, the memory 1020, the input/output interface 1030, the communication interface 1040 and the bus 1050, in a specific implementation, the device may also include other components necessary for normal operation. In addition, those skilled in the art will appreciate that the above-described apparatus may also include only those components necessary to implement the embodiments of the present description, and not necessarily all of the components shown in the figures.
The electronic device of the foregoing embodiment is used to implement the corresponding screen display method based on the micro front end frame in any of the foregoing embodiments, and has the beneficial effects of the corresponding method embodiment, which are not described herein again.
Based on the same inventive concept, corresponding to any of the above-mentioned embodiment methods, the present application further provides a non-transitory computer-readable storage medium storing computer instructions for causing the computer to execute the micro front-end frame based screen presentation method according to any of the above embodiments.
Computer-readable media, including both permanent and non-permanent, removable and non-removable media, for storing information may be implemented in any method or technology. The information may be computer readable instructions, data structures, modules of a program, 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 technology, compact disc read only memory (CD-ROM), digital Versatile Discs (DVD) or other optical storage, magnetic cassettes, magnetic tape magnetic disk storage or other magnetic storage devices, or any other non-transmission medium that can be used to store information that can be accessed by a computing device.
The computer instructions stored in the storage medium of the above embodiment are used to enable the computer to execute the screen display method based on the micro front end frame according to any of the above embodiments, and have the beneficial effects of corresponding method embodiments, which are not described herein again.
Those of ordinary skill in the art will understand that: the discussion of any embodiment above is meant to be exemplary only, and is not intended to intimate that the scope of the disclosure, including the claims, is limited to these examples; within the context of the present application, features from the above embodiments or from different embodiments may also be combined, steps may be implemented in any order, and there are many other variations of the different aspects of the embodiments of the present application as described above, which are not provided in detail for the sake of brevity.
In addition, well-known power/ground connections to Integrated Circuit (IC) chips and other components may or may not be shown in the provided figures for simplicity of illustration and discussion, and so as not to obscure the embodiments of the application. Furthermore, devices may be shown in block diagram form in order to avoid obscuring embodiments of the application, and this also takes into account the fact that specifics with respect to implementation of such block diagram devices are highly dependent upon the platform within which the embodiments of the application are to be implemented (i.e., specifics should be well within purview of one skilled in the art). Where specific details (e.g., circuits) are set forth in order to describe example embodiments of the application, it should be apparent to one skilled in the art that the embodiments of the application can be practiced without, or with variation of, these specific details. Accordingly, the description is to be regarded as illustrative instead of restrictive.
While the present application has been described in conjunction with specific embodiments thereof, many alternatives, modifications, and variations of these embodiments will be apparent to those skilled in the art in light of the foregoing description. For example, other memory architectures, such as Dynamic RAM (DRAM), may use the discussed embodiments.
The present embodiments are intended to embrace all such alternatives, modifications and variances which fall within the broad scope of the appended claims. Therefore, any omissions, modifications, substitutions, improvements, and the like that may be made without departing from the spirit and principles of the embodiments of the present application are intended to be included within the scope of the present application.

Claims (10)

1. A screen display method based on a micro front end frame is characterized by comprising the following steps:
constructing a micro front-end framework, wherein the micro front-end framework comprises a plurality of sub-applications;
constructing a display page, wherein the display page comprises a plurality of sub-areas;
setting a calling interface for each sub-area, and loading the sub-application into the sub-area through the calling interface; wherein the sub-applications are in one-to-one correspondence with the sub-regions;
and each sub-application acquires a corresponding display chart from an open-source visual chart library and displays the display chart in the corresponding sub-area.
2. The micro-front-end-frame-based screen presentation method of claim 1, wherein the micro-front-end frame further comprises a main application, and the main application is used for managing the plurality of sub-applications.
3. The micro-front-end-frame-based screen presentation method of claim 1, wherein the presentation page is composed of a page service frame and components.
4. The micro front-end framework based screen display method according to claim 1, wherein before the sub-application is loaded into the sub-area through the call interface, the method comprises:
and enabling the sub-application to register in the micro front-end framework.
5. The micro front end frame based screen display method of claim 1, further comprising:
refreshing the presentation graph presented within the sub-region, comprising:
in response to receiving a refresh instruction, the sub-application sending the refresh instruction to the visual chart library;
the visual chart library generates an updated display chart according to the refreshing instruction and sends the updated display chart to the sub-application;
and the sub-application displays the updated display chart in the corresponding sub-area.
6. The micro-front-end-frame-based screen presentation method of claim 1, wherein a presentation ratio of the presentation page is set by a configuration file based on the screen size.
7. The micro-front-end-frame-based screen presentation method of claim 1, further comprising:
and enabling each sub-application to acquire a corresponding real-time image from a pre-constructed database, and displaying the real-time image in the corresponding sub-area.
8. A screen display device based on little front end frame, its characterized in that includes:
a frame module configured to: constructing a micro front-end framework, wherein the micro front-end framework comprises a plurality of sub-applications;
a region module configured to: constructing a display page, wherein the display page comprises a plurality of sub-areas;
a loading module configured to: setting a calling interface for each sub-area, and loading the sub-application into the sub-area through the calling interface; the sub-applications correspond to the sub-regions one by one;
a presentation module configured to: and each sub-application acquires a corresponding display chart from an open-source visual chart library and displays the display chart in the corresponding sub-area.
9. An electronic device comprising a memory, a processor and a computer program stored on the memory and executable on the processor, the processor implementing the method of any one of claims 1 to 7 when executing the program.
10. A non-transitory computer-readable storage medium storing computer instructions for causing a computer to perform the method of any one of claims 1 to 7.
CN202210895309.6A 2022-07-26 2022-07-26 Screen display method based on micro front-end framework and related equipment Pending CN115495178A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210895309.6A CN115495178A (en) 2022-07-26 2022-07-26 Screen display method based on micro front-end framework and related equipment

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210895309.6A CN115495178A (en) 2022-07-26 2022-07-26 Screen display method based on micro front-end framework and related equipment

Publications (1)

Publication Number Publication Date
CN115495178A true CN115495178A (en) 2022-12-20

Family

ID=84466350

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210895309.6A Pending CN115495178A (en) 2022-07-26 2022-07-26 Screen display method based on micro front-end framework and related equipment

Country Status (1)

Country Link
CN (1) CN115495178A (en)

Similar Documents

Publication Publication Date Title
US11144711B2 (en) Webpage rendering method, device, electronic apparatus and storage medium
CN109597614B (en) Business page customization method and system
US20170091159A1 (en) Programmatic native rendering of structured content
CN104995601B (en) It is switched to the machine Web page application program and is switched away from from the machine Web page application program
CN109857486B (en) Method, device, equipment and medium for processing program page data
EP3848798A1 (en) Information processing method and apparatus, storage medium, and electronic device
CN107122172B (en) Light application processing method, light application running method, light application equipment and light application equipment
CN112667330B (en) Page display method and computer equipment
US20110022943A1 (en) Document object model (dom) application framework
WO2023040443A1 (en) Method and device for drawing canvas
US10148790B2 (en) Deployment of integrative HTML-based engine from an edge server
KR20140021091A (en) A dynamic loading apparatus and method of java script code performing native functions of hybrid web applications
US9430808B2 (en) Synchronization points for state information
CN115309470A (en) Method, device and equipment for loading widgets and storage medium
EP3008697B1 (en) Coalescing graphics operations
CN110618811B (en) Information presentation method and device
CN112395535A (en) Image lazy loading method and device, medium and electronic equipment
CN115495178A (en) Screen display method based on micro front-end framework and related equipment
CN113676677B (en) Dynamic picture synthesis method and device, electronic equipment and readable storage medium
CN109992698B (en) Data processing method and device, electronic equipment and readable storage medium
CN114115855A (en) Code multiplexing method and device, computer readable storage medium and electronic equipment
CA3093640A1 (en) Systems and methods for providing a web application to a computing device
KR20080017420A (en) Automatic updating of variables in a data language
AU2013204661B2 (en) A System and Method for Implementing an XML Stylesheet in a Multi-Tier Architecture
CN115809060B (en) Openlayers map construction method and device and electronic equipment

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination