Extension method, device and system for enhancing list data display and storage medium

Abstract

The invention discloses an extension method, device and system for enhancing list data display and a storage medium, and relates to the technical field of data processing. The method comprises the following steps: acquiring a page access request, loading a page component, and requesting required data through the page component; traversing the required data, and creating an instance of a ListItem distribution component for each item of data; loading a configuration set through the instance of the distribution component, traversing the configuration set, executing a test method for each configuration, and judging whether required data is matched with a specified display component in the configuration set for display through the test method; if the display component is matched with the required data, loading and initializing the display component through an instance of the distribution component, and transmitting the required data to the display component; and rendering the display component to a page for display. According to the embodiment of the invention, the accuracy and integrity of the data are ensured, the reliability and accuracy of data display are improved, the complexity of system maintenance is reduced, and the expandability of the system is improved.

Description

Technical Field

[0001] The present application belongs to the field of data processing technology, and in particular, relates to an extended method, device, system and storage medium for enhancing list data display. Background Art

[0002] In current website development practices, especially when dealing with list rendering with multiple types of data, traditional practices usually rely on using specific identification fields in the data items (such as type or category) to perform conditional judgments.

[0003] The basic logic of this method is: traverse the list data, and for each item of data, check whether its identification field matches the identification field of the component that currently needs to be rendered. If it matches, load the corresponding component for rendering.

[0004] However, with the diversification of data types and structures, this conditional judgment-based method gradually exposes the following significant problems: Increased code redundancy and complexity: When the number of data types exceeds a certain number (such as more than 5), the number of judgment statements that need to be written will increase dramatically, causing the code to become lengthy and difficult to read. This not only increases the cognitive burden of developers, but also reduces the maintainability of the code; Limited scalability: Whenever a new data type needs to be added or the rendering logic of an existing data type needs to be modified, developers need to have a deep understanding of the existing judgment logic and carefully add or modify the corresponding judgment statements. This process is not only cumbersome, but also error-prone, especially in complex projects, where new bugs may be introduced with a little carelessness; Increased testing difficulty: Since the judgment logic is scattered in multiple places and there are dependencies between each other, when performing unit testing or integration testing, it is necessary to ensure that all possible paths are covered. This not only increases the workload of testing, but also increases the difficulty and complexity of testing; Performance bottleneck: When a large amount of data needs to be rendered, frequent conditional judgments may become a performance bottleneck, affecting the page loading speed and user experience. Summary of the invention

[0005] The purpose of this application is to provide an extended method, device, system and storage medium for enhancing the display of list data, which enhances the display effect of list data through a series of steps to ensure that the data can be presented to users accurately and efficiently.

[0006] In order to achieve the above objectives, the solution of this application is: In a first aspect, an embodiment of the present application provides an extended method for enhancing list data display, including: obtaining a page access request, loading a page component, and requesting required data through the page component; Traverse the required data and create an instance of the ListItem distribution component for each data; Load the configuration collection through the instance of the ListItem distribution component, traverse the configuration collection, execute the verification method for each configuration, and use the verification method to determine whether the required data matches the display component specified in the configuration collection for display; if the display component matches the required data, load and initialize the display component through the instance of the ListItem distribution component, and transmit the required data to the display component; Render the display component to the page for display.

[0007] According to the above method of the embodiment of the present application, the following additional technical features may also be provided: Furthermore, the format of the required data is verified to ensure that the required data meets the input requirements of the display component specified in the configuration set; the type of the required data is checked to match the data type that the display component can handle; and the integrity of the required data is verified.

[0008] Furthermore, the configuration set is loaded through a configuration file, which includes an identifier of the display component, a format description of required data, initialization parameters of the display component, and a display style of the display component.

[0009] Furthermore, when creating an instance of the ListItem distribution component, it also includes assigning a unique identifier to each instance.

[0010] Furthermore, the method also includes preprocessing the display component before rendering the display component to the page, and adjusting the display effect of the display component according to the characteristics of the required data.

[0011] In a second aspect, an embodiment of the present application provides an extended device for enhancing list data display, including: a request loading module configured to obtain a page access request, load a page component, and request required data through the page component; The traversal distribution module is configured to traverse the required data and create an instance of a ListItem distribution component for each data item; The verification judgment module is configured to load the configuration set through the instance of the ListItem distribution component, traverse the configuration set, execute the verification method for each configuration, and judge whether the required data matches the display component specified in the configuration set for display through the verification method; if the display component matches the required data, the display component is loaded and initialized through the instance of the ListItem distribution component, and the required data is transmitted to the display component; The rendering and display module is configured to render the display component to the page for display.

[0012] In a third aspect, an embodiment of the present application provides an extended system for enhancing the display of list data, the system comprising a processor and a memory, the memory storing a computer program, the computer program being loaded and executed by the processor to implement an extended method for enhancing the display of list data as provided in the first aspect of the embodiment of the present application.

[0013] In a fourth aspect, an embodiment of the present application provides a computer-readable storage medium, in which a computer program is stored. When the computer program is executed by a processor, it is used to implement an extended method for enhancing the display of list data as in the first aspect of the embodiment of the present application.

[0014] Compared with the prior art, the extended method for enhancing list data display provided by the embodiment of the present application has the following beneficial technical effects: The embodiment of the present application flexibly adapts to data display requirements of different types and formats by loading a configuration set and matching and initializing display components according to the information in the configuration set; the configuration file contains key information such as the identification of the display component, the format description of the required data, initialization parameters and display style, making the configuration of data display simple and easy to manage.

[0015] The embodiment of the present application strictly verifies and checks the format, type and integrity of the required data before loading and displaying the data, thereby ensuring the accuracy and integrity of the data, avoiding display problems caused by data errors or missing data, and improving the reliability and accuracy of data display.

[0016] The embodiment of the present application efficiently manages and tracks the display status of each data item by assigning a unique identifier to each instance of the ListItem distribution component; before the display component is rendered to the page, the display component is preprocessed and the display effect is adjusted according to the characteristics of the data, thereby improving the visual effect and user experience of the page.

[0017] The embodiments of the present application make it simple and easy to add or modify display components, and only the relevant information in the configuration file needs to be updated; the complexity of system maintenance is reduced, and the scalability and maintainability of the system are improved. BRIEF DESCRIPTION OF THE DRAWINGS

[0018] Figure 1 A schematic diagram showing a flow chart of an extended method for enhancing list data display according to an embodiment of the present application; Figure 2 A structural block diagram of an extended device for enhancing list data display according to an embodiment of the present application is shown; Figure 3 A structural block diagram of a computer device according to an embodiment of the present application is shown. DETAILED DESCRIPTION

[0019] In order to make the above-mentioned purposes, features and advantages of the present application more obvious and easy to understand, the specific implementation methods of the present application are described in detail below in conjunction with the accompanying drawings. It is to be understood that the specific embodiments described herein are only used to explain the present application, rather than to limit the present application. It should also be noted that, for ease of description, only some structures related to the present application are shown in the accompanying drawings, rather than all structures. Based on the embodiments in the present application, all other embodiments obtained by ordinary technicians in this field without making creative work are within the scope of protection of this application.

[0020] The terms "including" and "having" and any variations thereof in this application are intended to cover non-exclusive inclusions. For example, a process, method, system, product or device comprising a series of steps or units is not limited to the listed steps or units, but may optionally include steps or units not listed, or may optionally include other steps or units inherent to these processes, methods, products or devices.

[0021] Reference to "embodiments" in this application means that a particular feature, structure, or characteristic described in conjunction with the embodiments may be included in at least one embodiment of the present application. The appearance of the phrase in various locations in the specification does not necessarily refer to the same embodiment, nor is it an independent or alternative embodiment that is mutually exclusive with other embodiments. It is explicitly and implicitly understood by those skilled in the art that the embodiments described in this application may be combined with other embodiments.

[0022] The embodiment of the present application aims to enhance the display effect of list data through a series of steps to ensure that the data can be presented to the user accurately and efficiently. Figure 1 As shown, the embodiment of the present application provides an extended method for enhancing the display of list data, including the following steps: Step 101, obtain a page access request, load a page component, and request required data through the page component.

[0023] When a user accesses a web page through a browser, the browser sends an HTTP request to the server. This request contains the URL of the page the user wants to access, the request method (such as GET or POST), the request header (such as User-Agent, Accept, etc.), and possible request body (for POST requests).

[0024] In front-end frameworks such as React, Vue or Angular, you usually don't need to manually obtain this request because the framework will handle routing and request distribution. However, you can use routing libraries (such as React Router, VueRouter) to obtain the URL and parameters of the current page.

[0025] Once the server receives the request and confirms the page to be returned, it loads the corresponding page component according to the requested URL. In the front-end framework, this is usually implemented through routing configuration.

[0026] The embodiment of the present application can use React Hooks (such as useState, useEffect). In React, useState can be used to manage the state of the component, and useEffect can be used to perform side effects (such as data acquisition) when the component is loaded. Hooks is a new feature provided by React 16.8, which provides function components with state and lifecycle functions that were originally only available in class components. Through Hooks, functional components can "hook into" the characteristics of class components, thereby having the ability to manage state and control lifecycle. In React applications, Hooks are often used to manage state and perform side effects (such as data acquisition, subscription, or manual modification of DOM) in function components.

[0027] You can also use a global state management library. If the application is complex and multiple components need to share state, you can consider using a global state management library such as Redux or Vuex. These libraries provide a way to centrally manage application state and allow the state to be shared and updated between components. A global state management library is a tool for managing global state in an application, which allows the state to be shared and modified between multiple components of an application. A global state management library can simplify state management, avoid tedious value transfer between components, and improve the maintainability and readability of the code. In React, common global state management libraries include Redux, MobX, etc. In Vue, Vuex is usually used for global state management. The global state management library is suitable for large applications that need to share state across components, such as user login information, shopping cart contents, etc.

[0028] Sometimes you may need to get data from the user's local storage, such as login status, user preferences, etc. You can use localStorage or sessionStorage to get data from local storage. localStorage is a read-only property of the window object in the browser, but it can be accessed through window.localStorage or the localStorage property to store key-value pairs. The data in localStorage is persistent and will be retained even if the browser is closed. It provides a simple and easy-to-use API to store, retrieve, and delete data. localStorage typically provides a larger storage capacity than cookies, generally 5MB (depending on the browser implementation). localStorage is often used to store user preferences, login credentials, shopping cart data, and other information that needs to be persisted.

[0029] sessionStorage is a storage mechanism provided by web browsers for storing and accessing data during a browser session. Unlike localStorage, sessionStorage data is temporary and valid only during the current browser session. When the user closes the browser window or tab, the data stored in sessionStorage is cleared. The storage capacity of sessionStorage is usually smaller than localStorage, but the specific size depends on the browser implementation. sessionStorage is suitable for storing session-related temporary data, such as user login information, temporary cache, etc.

[0030] In summary, obtaining page access requests, loading page components, and requesting required data through page components are the basic processes of front-end page loading and data acquisition. You can choose appropriate technologies and methods to implement this process based on specific application scenarios and requirements.

[0031] Step 102, traverse the required data and create an instance of a ListItem distribution component for each data item.

[0032] First, you need to make sure that you have obtained the required data from the backend API or other data source through the page component. This data is usually in the form of an array, where each element represents a data item. Next, you need to traverse this data array. In JavaScript (or similar front-end scripting languages), you can use for loops, forEach methods, map methods, or other iteration techniques to traverse arrays.

[0033] During the traversal process, for each data item, an instance of a ListItem distribution component needs to be created. Specifically, a new instance of a ListItem distribution component is created based on the data item. The current data item can be passed as a property (props) to the ListItem distribution component instance by calling React's createElement function or simply creating a new component object. In this way, the component can use this data to render its content. In addition, when creating an instance, the embodiment of the present application also assigns a unique identifier to each instance to facilitate tracking and management of the display status of each data item in subsequent processes.

[0034] After loading and traversing the required data, the embodiment of the present application strictly verifies the format, type and integrity of the data, including: Format validation: Ensure that the format of the required data meets the input requirements of the specified display component in the configuration collection. This helps avoid display errors or data loss due to data format mismatch; Type checking: Check the type of the required data to match the data type that the display component can handle. This ensures that the data can be parsed and displayed correctly, improving the availability and accuracy of the data; Integrity verification: By verifying the integrity of the required data, ensure that the data does not lack necessary fields or information. It helps maintain the integrity and consistency of the data and avoids display problems caused by incomplete data.

[0035] Step 103, load the configuration collection through the instance of the ListItem distribution component, traverse the configuration collection, execute the verification method for each configuration, and use the verification method to determine whether the required data matches the display component specified in the configuration collection for display; if the display component matches the required data, load and initialize the display component through the instance of the ListItem distribution component, and transfer the required data to the display component.

[0036] The ListItem distribution component is a component responsible for distributing and displaying data items. It may be a container component that is used to hold and display multiple data items. After the instance of the ListItem distribution component is created, it loads a configuration collection. This configuration collection contains various configuration information required to display data, such as data format, display method, style, etc.

[0037] Traversing the configuration set, traversing means processing each configuration in the configuration set one by one, and each configuration means that each item in the configuration set contains detailed information on how to display a specific type of data. The configuration set is a key component in the embodiment of the present application, defining the behavior and style of the display component. The configuration set is loaded through a configuration file, which includes: Display component identification: used to uniquely identify each display component, which is convenient for reference and management in subsequent steps; Required data format description: describes in detail the format and structure of the data required by the display component, providing a basis for data verification and parsing; Display component initialization parameters: including the initial state of the component, configuration options, etc., used to set its behavior when initializing the component; Display component display style: defines the visual effects of the component, such as color, font, layout, etc., to ensure that the data can be presented in a user-friendly manner.

[0038] A validation method is a function or method used to verify whether the data matches the configuration. For each configuration, the corresponding validation method is executed to determine whether the current data item meets the requirements of the configuration. If the data item meets the requirements of a configuration, the data item is considered to match the configuration. The display component specified in the configuration collection is the UI component used to display the matching data item. Once the data item matches a configuration, the corresponding display component is used to display the data item.

[0039] The embodiment of the present application verifies whether the data format complies with the rules in the current display component configuration file through the IsSupport verification method. IsSupport is a key logic method, which is responsible for matching the format and type of the current data item with the rules defined in the configuration file. These rules may include information such as the structure, field, type, etc. of the data to ensure that the data can be displayed correctly. Through the verification of the IsSupport method, it can be determined which display component is most suitable for the current data item.

[0040] The implementation of step 103 makes the data display process more flexible and dynamic. By configuring the collection and the verification method, the display requirements for different types of data can be easily met without writing a dedicated display logic for each data type. This not only improves the maintainability of the code, but also makes the data display more flexible and scalable.

[0041] This process of data matching and component rendering is very useful in a variety of application scenarios, including e-commerce websites: displaying product lists, dynamically selecting appropriate display components based on product type, price and other attributes; social media: displaying dynamic messages, dynamically selecting appropriate display components based on message type (such as text, image, video); enterprise applications: displaying data reports, dynamically selecting appropriate chart components based on report type and data format.

[0042] When a configuration item matching the required data is found, the instance of the ListItem dispatch component selects the corresponding display component according to the component type specified in the configuration item. The instance of the ListItem dispatch component loads the selected display component and performs initialization operations. The initialization process may include setting component properties, binding event handlers, and other operations. After initialization is completed, the instance of the ListItem dispatch component transfers the required data to the display component. This process may involve operations such as data format conversion and verification.

[0043] Step 104: Render the display component to the page for display.

[0044] Prior to step 104, all data preparation, component instantiation, and configuration validation have been completed. The display component has been loaded and initialized based on the matching data and configuration. Rendering is the process of converting the component's virtual DOM (if a modern front-end framework such as React, Vue, etc. is used) or HTML structure into visible elements on the actual page. The display component builds its internal DOM structure or virtual DOM based on the received data and configuration information. If a front-end framework is used, the framework is responsible for comparing the virtual DOM with the actual DOM and updating the elements on the page efficiently. If the DOM is manipulated directly, the display component performs the necessary DOM operations to create and update the elements on the page.

[0045] During the rendering process, the display component will also apply the corresponding CSS styles to ensure that the appearance of the page elements meets the design requirements. At the same time, the display component will handle user interactions, such as click events, hover effects, etc. In order to improve rendering performance, various optimization strategies can be adopted, such as lazy loading, code splitting, virtual scrolling, etc. These optimization strategies help reduce the loading time of the page and improve the user experience.

[0046] Modern front-end frameworks such as React, Vue, and Angular provide powerful component-based development capabilities, making the rendering process more efficient and maintainable. Even if you don't use a front-end framework, you can use native JavaScript to manipulate the DOM to render and update the page, or use Web components, a browser standard that allows developers to create reusable custom elements that can be rendered and used like native HTML elements.

[0047] The embodiment of the present application also pre-processes the display component before rendering it to the page. According to the characteristics of the required data, the display effect of the display component is adjusted, such as adjusting the font size, color or adding a specific icon. This helps to enhance the readability and attractiveness of the data and improve the user's browsing experience. Finally, the pre-processed display component is rendered to the page to display the data in a user-friendly manner.

[0048] It should be noted that different browsers have different levels of support for DOM operations and CSS styles. Developers need to ensure that display components can be rendered correctly on all target browsers. For large applications or complex pages, the rendering process may become a performance bottleneck. Developers need to adopt optimization strategies to reduce rendering time and improve page responsiveness. When the data on the page changes, the display component needs to be able to update its rendering results efficiently. This usually involves the concepts of state management and data binding.

[0049] In summary, the embodiment of the present application distributes components, configures in a loop, verifies whether the components in the configuration conform to the current data, and dynamically loads the current component and renders the page if it conforms. When adding a new component, a new component file is created according to the existing components, and the verification rules of the components are developed and written by the components themselves, which reduces the need for everyone to add judgments, and can also well reduce the scope of development. In the later maintenance, when adding new list display items, the time spent is much less than the time spent on the traditional combing logic plus judgment, and can also reduce the development cost, testing cost, and later maintenance cost. Each time a new component is added, it is only necessary to add a new component file and write its own component verification rules. There is no need to add a judgment like the original approach, nor to modify the existing page, thereby causing new problems and bugs. The adder or maintainer only needs to find the corresponding component to modify it. The scope of influence is only in a single component, and will not affect the rendering of the entire existing list. In this way, the corresponding functions can be developed efficiently, the coupling of the code can be reduced, the labor cost and time cost can be reduced, and the flexibility of maintenance can be further improved.

[0050] like Figure 2 As shown, the embodiment of the present application provides an extended device for enhancing the display of list data, including a request loading module 201, a traversal distribution module 202, a verification judgment module 203 and a rendering display module 204, wherein: The request loading module 201 is configured to obtain a page access request, load a page component, and request required data through the page component; The traversal distribution module 202 is configured to traverse the required data and create an instance of a ListItem distribution component for each data item; The verification judgment module 203 is configured to load the configuration set through the instance of the ListItem distribution component, traverse the configuration set, execute the verification method for each configuration, and judge whether the required data matches the display component specified in the configuration set for display through the verification method; if the display component matches the required data, the display component is loaded and initialized through the instance of the ListItem distribution component, and the required data is transmitted to the display component; The rendering and display module 204 is configured to render the display component to a page for display.

[0051] The extended device for enhancing the display of list data in the embodiment of the present application can be a computer device, or a component in the computer device, such as an integrated circuit or a chip. The computer device can be a terminal, or other devices other than a terminal. Exemplarily, the computer device can be a mobile phone, a tablet computer, a laptop computer, a PDA, a vehicle-mounted computer device, a mobile Internet device (Mobile Internet Device, MID), an ultra-mobile personal computer (Ultra-Mobile Personal Computer, UMPC), a netbook or a personal digital assistant (Personal Digital Assistant, PDA), etc., and can also be a server, a network attached storage (Network Attached Storage, NAS), a personal computer (Personal Computer, PC), etc., which is not specifically limited in the embodiment of the present application.

[0052] The extended device for enhancing list data display provided in the embodiment of the present application can achieve Figure 1 To avoid repetition, the various processes implemented in the embodiment of the extended method for enhancing list data display are not described here.

[0053] The present application also provides a computer device, such as Figure 3 As shown, the computer device includes a processor 301 and a memory 302. The memory 302 stores programs or instructions that can be executed on the processor 301. When the program or instructions are executed by the processor 301, the various steps of the above-mentioned extended method for enhancing the display of list data are implemented, and the same technical effect can be achieved. To avoid repetition, they are not repeated here.

[0054] It should be noted that the computer device in the embodiment of the present application includes the above-mentioned mobile computer device and non-mobile computer device.

[0055] The memory 302 can be used to store software programs and various data. The memory 302 may mainly include a first storage area for storing programs or instructions and a second storage area for storing data, wherein the first storage area may store an operating system, an application program or instructions required for at least one function (such as a sound playback function, an image playback function, etc.), etc. In addition, the memory 302 may include a volatile memory or a non-volatile memory, or the memory 302 may include both volatile and non-volatile memories. Among them, the non-volatile memory may be a read-only memory (ROM), a programmable read-only memory (PROM), an erasable programmable read-only memory (EPROM), an electrically erasable programmable read-only memory (EEPROM), or a flash memory. The volatile memory may be a random access memory (RAM), a static random access memory (SRAM), a dynamic random access memory (DRAM), a synchronous dynamic random access memory (SDRAM), a double data rate synchronous dynamic random access memory (DDRSDRAM), an enhanced synchronous dynamic random access memory (ESDRAM), a synchronous link dynamic random access memory (SLDRAM) and a direct memory bus random access memory (DRRAM). The memory 302 of the embodiment of the present application includes but is not limited to these and any other suitable types of memory.

[0056] The processor 301 may include one or more processing units; optionally, the processor 301 integrates an application processor and a modem processor, wherein the application processor mainly processes operations related to an operating system, a user interface, and application programs, and the modem processor mainly processes wireless communication signals, such as a baseband processor. It is understandable that the modem processor may not be integrated into the processor 301.

[0057] An embodiment of the present application also provides a readable storage medium, on which a program or instruction is stored. When the program or instruction is executed by a processor, each process of the above-mentioned extended method embodiment for enhancing the display of list data is implemented, and the same technical effect can be achieved. To avoid repetition, it will not be repeated here.

[0058] An embodiment of the present application also provides a chip, which includes a processor and a communication interface. The communication interface and the processor are coupled, and the processor is used to run programs or instructions to implement the various processes of the above-mentioned extended method embodiment for enhancing the display of list data, and can achieve the same technical effect. To avoid repetition, it will not be repeated here.

[0059] It should be understood that the chip mentioned in the embodiments of the present application can also be called a system-level chip, a system chip, a chip system or a system-on-chip chip, etc.

[0060] An embodiment of the present application also provides a computer program product, which is stored in a storage medium. The program product is executed by at least one processor to implement the various processes of the extended method embodiment for enhancing the display of list data as described above, and can achieve the same technical effect. To avoid repetition, it will not be repeated here.

[0061] It should be noted that, in the present application, the terms "comprise", "include" or any other variant thereof are intended to cover non-exclusive inclusion, so that a process, method, article or device including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, article or device. In the absence of further restrictions, an element defined by the sentence "comprises one..." does not exclude the presence of other identical elements in the process, method, article or device including the element. In addition, it should be noted that the scope of the method and device in the embodiment of the present application is not limited to performing functions in the order shown or discussed, and may also include performing functions in a substantially simultaneous manner or in reverse order according to the functions involved, for example, the described method may be performed in an order different from that described, and various steps may also be added, omitted, or combined. In addition, the features described with reference to certain examples may be combined in other examples.

[0062] The embodiments of the present application are described above in conjunction with the accompanying drawings, but the present application is not limited to the above-mentioned specific implementation methods. The above-mentioned specific implementation methods are merely illustrative and not restrictive. Under the guidance of the present application, ordinary technicians in this field can also make many forms without departing from the purpose of the present application and the scope of protection of the claims, all of which are within the protection of the present application.

Claims

1. An extended method for enhancing list data display, characterized in that: The method comprises: Obtain a page access request, load a page component, and request required data through the page component; Traverse the required data and create an instance of a ListItem distribution component for each data item; Loading a configuration set through an instance of the ListItem distribution component, traversing the configuration set, executing a verification method for each configuration, and determining through the verification method whether the required data matches a display component specified in the configuration set for display; If the display component matches the required data, then loading and initializing the display component through the instance of the ListItem distribution component, and transmitting the required data to the display component; Render the display component to the page for display.

2. The method for enhancing the display of list data according to claim 1, characterized in that: The method comprises: The format of the required data is verified to ensure that the required data meets the input requirements of the display component specified in the configuration set; the type of the required data is checked to match the type of data that can be processed by the display component; and the integrity of the required data is verified.

3. The method for enhancing the display of list data according to claim 1, characterized in that: The configuration set is loaded through a configuration file, which includes an identifier of a display component, a format description of required data, initialization parameters of the display component, and a display style of the display component.

4. The method for enhancing the display of list data according to claim 1, characterized in that: The method comprises: When an instance of the ListItem distribution component is created, each instance is assigned a unique identifier.

5. The method for enhancing the display of list data according to claim 1, characterized in that: The method further includes preprocessing the display component before rendering the display component to the page, and adjusting the display effect of the display component according to the characteristics of the required data.

6. An extended device for enhancing list data display, characterized in that: The device comprises: A request loading module is configured to obtain a page access request, load a page component, and request required data through the page component; A traversal distribution module is configured to traverse the required data and create an instance of a ListItem distribution component for each data item; A verification and judgment module is configured to load a configuration set through an instance of the ListItem distribution component, traverse the configuration set, execute a verification method for each configuration, and judge whether the required data matches the display component specified in the configuration set for display through the verification method; if the display component matches the required data, load and initialize the display component through the instance of the ListItem distribution component, and transmit the required data to the display component; The rendering and display module is configured to render the display component to a page for display.

7. An extended system for enhancing list data display, the system comprising a processor and a memory, wherein a computer program is stored in the memory, characterized in that: The computer program is loaded and executed by the processor to implement the extended method for enhancing list data presentation as described in any one of claims 1 to 5.

8. A computer-readable storage medium, wherein a computer program is stored in the storage medium, characterized in that: When the computer program is executed by a processor, it is used to implement the extended method for enhancing list data display as described in any one of claims 1 to 5.

Images