CN115098512A - Table data display method and device, electronic equipment and storage medium - Google Patents

Table data display method and device, electronic equipment and storage medium Download PDF

Info

Publication number
CN115098512A
CN115098512A CN202210844805.9A CN202210844805A CN115098512A CN 115098512 A CN115098512 A CN 115098512A CN 202210844805 A CN202210844805 A CN 202210844805A CN 115098512 A CN115098512 A CN 115098512A
Authority
CN
China
Prior art keywords
data
preset
component
table data
cell
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
CN202210844805.9A
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.)
Chongqing Changan Automobile Co Ltd
Original Assignee
Chongqing Changan Automobile 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 Chongqing Changan Automobile Co Ltd filed Critical Chongqing Changan Automobile Co Ltd
Priority to CN202210844805.9A priority Critical patent/CN115098512A/en
Publication of CN115098512A publication Critical patent/CN115098512A/en
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/20Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
    • G06F16/22Indexing; Data structures therefor; Storage structures
    • G06F16/2282Tablespace storage structures; Management thereof
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/20Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
    • G06F16/24Querying
    • G06F16/242Query formulation
    • G06F16/2428Query predicate definition using graphical user interfaces, including menus and forms
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/20Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
    • G06F16/24Querying
    • G06F16/248Presentation of query results

Abstract

The present application relates to the field of computer technologies, and in particular, to a method and an apparatus for displaying tabular data, an electronic device, and a storage medium, where the method includes: acquiring search content in a search box; searching table data matched with the search content by using a preset search component; and when the table data is matched, calling the preset rendering component to render the table data, and displaying the table data on the interactive interface, otherwise, when the calling function of the preset rendering component is not triggered, carrying out error reporting reminding through the preset searching component. Therefore, the problems that rendering data are directly returned according to the request of the user in the related technology, rendering resources are easily wasted, data request time is prolonged, user use experience is reduced and the like in case that the table display content is empty are solved.

Description

Table data display method and device, electronic equipment and storage medium
Technical Field
The present application relates to the field of computer technologies, and in particular, to a method and an apparatus for displaying table data, an electronic device, and a storage medium.
Background
At present, in the development process, a table is most commonly used, in order to rapidly make the table and bind data and further accelerate the generation speed of the table, a rendering mode is often adopted, so that the code amount is greatly reduced, and the generation of the table is more convenient and accurate.
In the related art, the table data is often presented by directly returning to the data rendering through a user input search content request interface. However, once the database has no data requested to be searched by the user, the returned form display content is empty, which causes waste of resources and results in unfriendly user experience.
Disclosure of Invention
The application provides a table data display method and device, electronic equipment and a storage medium, and aims to solve the problems that rendering data are directly returned according to a request of a user in the related art, rendering resources are easily wasted, data request time is prolonged, user use experience is reduced and the like once table display contents are empty.
An embodiment of a first aspect of the present application provides a method for displaying table data, including the following steps: acquiring search content in a search box; searching table data matched with the search content by using a preset search component; and when the table data is matched, calling a preset rendering component to render the table data, and displaying the table data on an interactive interface, otherwise, when the calling function of the preset rendering component is not triggered, carrying out error reporting reminding through the preset searching component.
According to the technical means, the method and the device can directly report the error reminding when the data table content is empty, the rendering function does not need to be called for rendering, the resource waste is effectively avoided, the data request time is shortened, the resource waste and the complexity of calling a plurality of interfaces are reduced, the user time is saved, and the user use experience is improved.
Optionally, the displaying the form data on the interactive interface includes: detecting whether a cell with a data length exceeding a preset length exists in the table data; when the cell with the data length larger than the preset length is detected, hiding the data exceeding the preset length in the cell, and displaying all the contents of the cell in a suspension manner when the display operation of the cell is identified.
According to the technical means, when the form data is displayed on the interactive interface, whether the length of the form data exceeds the cell with the preset length or not is detected, when the length of the data is larger than the cell with the preset length, the data exceeding the preset length in the cell is hidden, the whole content of the cell is displayed in a floating mode during displaying, and when the length of the data is smaller than or equal to the cell with the preset length, the whole appearance and readability of the form are improved, and better user experience is brought.
Optionally, the invoking a preset rendering component to render the table data includes: detecting whether the preset rendering component has an interface without data or not; and if so, generating a null array, and calling the rendering component by using the null array.
According to the technical means, if the interface without data exists in the preset rendering component, the null array is generated, the rendering component is called by the null array, the phenomenon that historical search data is filled due to the fact that no data exists is avoided, work efficiency is improved, and user experience is improved.
Optionally, after the interactive interface displays the form data, the method further includes: identifying an expansion intention of a user on a header in the form data, wherein the header is an operation field with a drop-down box, and the drop-down box comprises a plurality of operation options; controlling a drop-down frame of the header to be unfolded according to the unfolding intention, and identifying the operation intention of a user; and selecting any one of the operation options according to the operation intention of the user, and executing target operation on the table data according to the selected operation option.
According to the technical means, in the embodiment of the application, form data is displayed on an interactive interface, a form head is designed to be an operation field with a drop-down box, the form head further comprises necessary fields and operation buttons of a form, and the operation buttons have the functions of editing, deleting, putting on a shelf, putting off a shelf and the like.
Optionally, the preset search component is obtained by encapsulating a Table component and a Pagination component.
According to the technical means, the Table component and the Pagination component are secondarily packaged to form a new component, so that all information is displayed for a user, the corresponding page can be conveniently and quickly skipped, and the interaction experience between the user and the page is improved.
The embodiment of the second aspect of the present application provides a device for displaying table data, including: the acquisition module is used for acquiring search contents in the search box; the searching module is used for searching the table data matched with the searching content by utilizing a preset searching component; the display module is used for calling a preset rendering component to render the table data and displaying the table data on an interactive interface when the table data is matched; and the reminding module is used for carrying out error reporting reminding through the preset search component while not triggering the calling function of the preset rendering component when the table data is not matched.
Optionally, the display module is configured to: detecting whether a cell with a data length exceeding a preset length exists in the table data; when the cell with the data length larger than the preset length is detected, hiding the data exceeding the preset length in the cell, and displaying all the contents of the cell in a suspension manner when the display operation of the cell is identified.
Optionally, the apparatus for displaying table data further includes: the identification module is used for identifying the expansion intention of a user on a header in the form data after the form data is displayed on an interactive interface, wherein the header is an operation field with a drop-down box, and the drop-down box comprises a plurality of operation options; and the control module is used for controlling the drop-down box of the header to be expanded according to the expansion intention, identifying the operation intention of the user, selecting any one of the operation options according to the operation intention of the user, and executing target operation on the table data according to the selected operation option.
An embodiment of a third aspect of the present application provides an electronic device, including: the system comprises a memory, a processor and a computer program stored on the memory and capable of running on the processor, wherein the processor executes the program to realize the presentation method of the table data according to the embodiment.
A fourth aspect of the present application provides a computer-readable storage medium, on which a computer program is stored, where the computer program is executed by a processor, so as to implement the method for presenting tabular data according to the foregoing embodiments.
Therefore, the application has at least the following beneficial effects:
(1) according to the embodiment of the application, the error prompt can be directly reported when the content of the data table is empty, the rendering function does not need to be called for rendering, the waste of rendering resources is effectively avoided, the data request time is reduced, the waste of resources and the complexity of calling a plurality of interfaces are reduced, the time of a user is saved, and the use experience of the user is improved;
(2) in the embodiment of the application, when the form data is displayed on an interactive interface, whether the length of the form data exceeds a cell with a preset length or not is detected, when the length of the data is larger than the cell with the preset length, the data exceeding the preset length in the cell is hidden, all the contents of the cell are displayed in a floating mode during displaying, and when the length of the data is smaller than or equal to the cell with the preset length, all the contents are displayed, so that the integral attractiveness and readability of the form are improved, and better user experience is brought;
(3) according to the embodiment of the application, the null array is generated by detecting whether the preset rendering component has a data-free interface or not, and the rendering component is called by using the null array, so that the phenomenon that historical search data is filled due to the fact that no data exists is avoided, the working efficiency is improved, and the use experience of a user is improved;
(4) in the embodiment of the application, form data is displayed on an interactive interface, a form header is designed to be an operation field with a drop-down frame, the operation field comprises necessary fields, and operation buttons of the form, and has functions of editing, deleting, putting on a shelf, putting off a shelf and the like, the expansion of the drop-down frame of the form header is controlled by identifying whether a user sets the expansion intention of the form header in the form data, namely the expansion intention or the non-expansion intention is set, then any one of a plurality of operation options is selected according to the operation intention of the user, the operation is executed on the form data, the button for the form operation can select the operation to be executed through the drop-down frame, so that an operation bar is not too bulky, the selection can be carried out according to the intention of the user, and the use experience of the user is improved;
(5) according to the embodiment of the application, the Table component and the Pagination component are packaged for the second time to form a new component, so that all information is displayed for a user, the corresponding page can be conveniently and rapidly jumped to, and the interaction experience of the user and the page is improved.
Additional aspects and advantages of the present application will be set forth in part in the description which follows and, in part, will be obvious from the description, or may be learned by practice of the present application.
Drawings
The foregoing and/or additional aspects and advantages of the present application will become apparent and readily appreciated from the following description of the embodiments, taken in conjunction with the accompanying drawings of which:
FIG. 1 is a flow chart of a method for presenting tabular data in accordance with an embodiment of the present application;
FIG. 2 is a flow chart illustrating steps of a method for presenting tabular data according to an embodiment of the present application;
FIG. 3 is a flow chart illustrating steps of a method for presenting tabular data according to one embodiment of the present application;
FIG. 4 is a detailed flowchart of a method for displaying tabular data according to an embodiment of the present application;
fig. 5 is an exemplary diagram of a presentation apparatus of table data according to an embodiment of the present application;
fig. 6 is a schematic structural diagram of an electronic device according to an embodiment of the application.
Detailed Description
Reference will now be made in detail to embodiments of the present application, examples of which are illustrated in the accompanying drawings, wherein like or similar reference numerals refer to the same or similar elements or elements having the same or similar function throughout. The embodiments described below with reference to the drawings are exemplary and intended to be used for explaining the present application and should not be construed as limiting the present application.
With the development of the internet and the advancement of technology, the rendering and presentation of front-end pages are more and more diversified, and interactive presentation of front-end and back-end data has become a mainstream expression form. The form is the first choice for data presentation due to the intuitive image and convenient operation, and occupies a non-minactivable important position in the rendering of the front-end page.
At present, most of data Table rendering in background system management in an enterprise is a Table component in an ant, and the Table component can meet the basic requirements of the current company. However, most people are not completely transparent to the use of API in Table component, and in addition, the simplification of Table component and the aesthetic appearance of page rendering make the user often in an embarrassing situation during the use, resulting in low development efficiency and poor user experience. At present, a few problems still exist in the use of Table components, which are specifically as follows:
scene one:
the rendering of the table is often accompanied by a request of the backend interface, and the user requests the interface data of the backend by inputting the content. The page with a query box requests a back-end interface by inputting the query content, and renders the data to be displayed in the table. The influence brought by the operation is that for data which does not exist in the database, the legality of the input content is not checked, the interface data is directly requested, the table display content is empty, the waste of resources is caused, for the database with large data volume, a large amount of time is consumed for requesting the data, and the user experience brought by the operation is not friendly.
Scene two:
when the data volume is large, the traditional Table component can perform paging through the set API, and can realize the jump of the page. However, when there are more pages, the user experience is too poor due to the need to click one by one.
Scene three:
when the data displayed in a certain table body is too long, the data is easily displayed in a new line in the table, so that the whole table is deformed, and the page is not beautiful.
Scene four:
for the operation of data in the table, if a large number of operation buttons exist in the table, the problems of page unattractive appearance and insufficient space display are caused.
Therefore, the embodiment of the application provides a table data display method, which comprises the steps of verification of input codes, initial processing of data, rendering of a table and UI adjustment of a table component. A method, an apparatus, an electronic device, and a storage medium for displaying table data according to embodiments of the present application are described below with reference to the drawings.
Specifically, fig. 1 is a schematic flow chart of a method for displaying table data according to an embodiment of the present disclosure.
As shown in fig. 1, the method for displaying table data includes the following steps:
in step S101, search content in a search box is acquired.
It can be understood that, the embodiment of the application can learn about the search content of the user by acquiring the search content in the search box, so as to prepare for displaying the related content in the next step.
In step S102, table data matching the search content is searched for using a preset search component.
The preset search component may be a search component preset by a user, or may be a search component commonly used by the user on the basis of big data, for example: keyword search, precise classification search, and the like, which are not specifically limited herein.
It can be understood that, in the embodiment of the application, a user searches for related content by using a preset search component, and automatically matches form data according to the search content, so that the working efficiency is improved, and the user experience is improved.
In the embodiment of the application, the preset search component is obtained by packaging a Table component and a Pagination component.
The Table component is a database control, and is mainly used for creating a Table on a web page, and the function of the Table component is similar to that of an html Table, except that the Table control can generate the Table in a programming mode by using dynamic content.
The Pagination component is a technology of memory management in an operating system, which can make a main memory of a computer use data stored in an auxiliary memory, the operating system partitions the data in the auxiliary memory (usually a disk) into fixed-size blocks called "pages" (pages), and when the data is not needed, the pages are moved from the main memory (usually a memory) to the auxiliary memory; when needed, the data is retrieved and loaded into main memory, and paging, which is the smallest unit of transferring blocks of data between disk and memory, allows memory to be stored in discrete blocks to maintain file system alignment relative to fragmentation.
It can be understood that in the embodiment of the application, the Table component and the Pagination component are secondarily packaged to form a new component, so that all information is displayed for a user, a corresponding page can be conveniently and quickly skipped, and the interaction experience between the user and the page is improved.
In step S103, when the table data is matched, the preset rendering component is called to render the table data, and the table data is displayed on the interactive interface, otherwise, the preset search component is used to perform error notification while the calling function of the preset rendering component is not triggered.
The preset rendering component may be preset by a user, for example, a model or a component for outputting a scene to an image file, a video signal, or a motion picture film, and is not limited in this respect.
It can be understood that, after the table data is matched, the preset rendering component is called and the table data is displayed on the interactive interface, if the relevant content cannot be searched, the relevant table data cannot be matched, the preset searching component is used for carrying out error reporting reminding and the calling function of the preset rendering component is not triggered, so that the waste of resources is reduced, the time of a user is saved, and the use experience of the user is improved.
Specifically, when a user searches for search content, the search component comprises the inspection of input content, wherein for the verification of non-empty and front and back blank spaces of a search box, the phenomenon that an interface parameter is null is avoided, for an entry not in a database, the front-end search component feeds back to the user in a form of 'no search content exists', and when table data is matched, a preset rendering component is called to render the table data, wherein the rendering component comprises two types: rendering and data rendering of the table cells, rendering the table cells, configuring title and dataIndex attributes in a header, matching the data successfully requested according to the dataIndex attributes, acquiring specific data of each row in the table body, and rendering the specific data into individual cells; and data rendering, in the render, calling the primarily processed data, rendering the table data, and storing the rendered table data into a page container.
In the embodiment of the present application, invoking a preset rendering component to render table data includes: detecting whether a preset rendering component has an interface without data; and if so, generating a null array, and calling the rendering component by using the null array.
The null array is an array with a length of 0, the null (null pointer) array is a null reference, if a method returns an array, if the method returns null, the calling method must first judge whether null is returned or not, and then the returned array can be further processed, and if the null array is returned, null reference check is not needed.
It can be understood that, in the embodiment of the application, whether a data-free interface exists in the preset rendering component is detected, if yes, a null array is generated and the rendering component is called, and if not, the rendering component is directly called to render table data, so that the phenomenon that historical search data is filled due to the fact that no data exists is avoided, the work efficiency is improved, and the use experience of a user is improved.
Specifically, the computer searches checked input content and skips to a form detail page through query carrying parameters by routing; sending an interface request after the component mounting is finished, and storing returned successful data in an internal props attribute through model state management; and returning the failed data back to the null array, thereby avoiding the problem of rendering the last interface data because the interface does not return the data.
In the embodiment of the application, displaying the form data on the interactive interface comprises: detecting whether a cell with a data length exceeding a preset length exists in the table data; and when the cell with the data length larger than the preset length is detected, hiding the data with the length exceeding the preset length in the cell, and displaying all the contents of the cell in a floating manner when the display operation of the cell is identified.
The interactive interface is a channel for information exchange between a person and a computer, a user inputs information to the computer through the interactive interface and operates the computer, and the computer provides information for the user through the interactive interface for reading, analyzing and judging, for example: a graphical user interface, a multimedia user interface, etc., and is not specifically limited herein.
The preset length may be preset by a user, that is, the preset length is the maximum width of the cell, for example, 15 characters, and is not limited specifically herein.
It can be understood that, whether the data length of the table exceeds the cell with the preset length or not is detected, when the data length is larger than the cell with the preset length, the data exceeding the preset length in the cell are hidden, the whole content of the cell is displayed in a mouse suspension mode during displaying, the table deformation caused by overlong data is avoided, and the table is displayed completely when the data length is smaller than or equal to the cell with the preset length, so that the integral attractiveness and readability of the table are improved, and better user experience is brought.
Specifically, the layout of a UI (User Interface Design) is readjusted for a rendered table, a phenomenon that the table is deformed when being displayed in rows due to an excessively long data amount exists, the maximum width of a cell is set, and when it is determined that a certain number of words is exceeded, the mouse is set to display all the contents in a floating manner, and data that does not exceed the length is normally displayed.
In the embodiment of the present application, after the table data is displayed on the interactive interface, the method further includes: identifying an expansion intention of a user on a header in table data, wherein the header is an operation field with a drop-down box, and the drop-down box comprises a plurality of operation options; controlling the drop-down frame of the header to be unfolded according to the unfolding intention, and identifying the operation intention of the user; and selecting any one of the operation options according to the operation intention of the user, and executing target operation on the table data according to the selected operation option.
The header is an operation field with a drop-down box, and the drop-down box includes a plurality of operation options, such as editing, deleting, putting on shelf, putting off shelf, and other function options.
The unfolding intention of the user is to unfold or not unfold the header.
The operation intention of the user refers to that the user selects any one or more of the operation options according to the actual operation will, and operates the form data according to the operation options, for example: an off-shelf operation, when the off-shelf attribute is selected, the list will show the off-shelf.
It can be understood that in the embodiment of the present application, form data is displayed on an interactive interface, a form header is designed to be an operation field with a drop-down box, and the form header further includes operation buttons of a form, which have functions of editing, deleting, putting on a shelf, putting off a shelf, and the like, by identifying whether a user sets an expansion intention of the form header in the form data, that is, an expansion or non-expansion intention, the expansion of the drop-down box of the form header is controlled, and then any one of a plurality of operation options is selected according to the operation intention of the user, an operation is performed on the form data, and the button for form operation can select an operation to be performed through the drop-down box, so that an operation bar is not too bulky, and can be selected by the user, a display mode is not changed, and user experience is improved.
Specifically, the display content of the form is designed, the form comprises necessary displayed fields in the display interface return, operation buttons of the form, and the functions of editing, deleting, putting on shelves, putting off shelves and the like are included, the operation buttons can be automatically adjusted according to actual conditions, when the attribute of the putting off shelves is selected, the putting off shelves are displayed on the list, for the commodities which are already put off shelves, the putting off shelves button of the row is in a failure state, other attributes are similar, and the default display is the deleting button.
According to the method for displaying the table data, which is provided by the embodiment of the application, the user experience can be improved, the product development difficulty and complexity can be reduced, the working efficiency can be improved, and the enterprise cost can be reduced, and as shown in fig. 2, the method comprises the following steps:
checking Step1 of data searching, checking the searched content, and preparing for subsequent work;
setting configuration Step2 of the table, wherein the configuration Step comprises a header field of Step2-1 configuration table according to specific situations in FIG. 3; step2-2, storing successfully returned data in the stages in the model state management, and particularly, when a plurality of tables are rendered, returning an empty array for the condition that data does not exist in a certain interface, avoiding filling data of historical search due to no data, further screening and filtering successfully returned data, and reserving needed data; step2-3 matches the header to the body one by one via the dataIndex attribute.
And Step3, page rendering, filling the matched data into a table, and rendering on the page through a render () function.
And adjusting Step4 of the page UI, setting the maximum width of the cell, and setting a mouse to display the content in a suspension manner, so that the table deformation caused by overlong data is avoided.
In a specific application, the method of the embodiment of the present application may be elaborated on the display of the form data based on the flowchart shown in fig. 4, which is as follows:
in the first stage, the search content is checked to prepare for subsequent work. In the step, negotiation with a rear-end interface person is needed, search contents which do not exist in the database are stored in a certain field, and an interface is called to receive data when the field is judged to be empty; otherwise, the user is prompted to input the content wrongly.
The second stage configures the header of the table. A select selection box is set for the operation attribute of the table, and option options can comprise deletion, editing, shelving up, shelving down and the like. Adding or subtracting according to the requirement.
And storing the data of the third stage. And storing the successful data returned by the interface in the props through the model state management centralized management state, and connecting the UI interface with the model state through connect to acquire the required data. It should be noted that when rendering a plurality of tables, when an interface is displayed, the model returns to an empty state, otherwise, the last requested data is rendered, which results in a mismatch between the page and the interface data.
And the fourth stage of data primary processing. After the component is mounted, calling a corresponding interface in a componentDidMount function through a dispatch function, receiving data and storing the data in an array. And screening the data meeting the requirements by using array methods such as filter, map, find and the like for the returned successful data.
And matching the fifth-stage data table. And matching the processed data with the headers in columns one by one through dataIndex attributes, and filling the tables.
And sixth stage of page rendering. And filling the matched data into a table, and rendering the data on the page through a render () function.
And displaying the page number in the seventh stage. The maximum width of the cell is set, the mouse is set to display the content of the cell in a suspension mode, the deformation of the cell caused by overlong data is avoided, the function of page number fast jumping is configured, and false can be set in the Table through the paging attribute to be not displayed.
And finally, adjusting the whole page. Aiming at the problem of the display process of partial table contents, the maximum cell width is set in the cell, and whether the mouse is displayed in a floating mode or not is judged.
In summary, the embodiment of the application verifies the rendering of data by the form component in the form component through the search component, and the form component not only comprises processing for displaying overlong form deformation on a data field, but also comprises processing for displaying overlong scroll bars on form positions and processing for quickly finding needed data when the data amount is large, so that the search component and the form component can realize daily requirements of most companies in daily life, when the use of the components is designed, only the configuration of individual parameters needs to be changed without independently introducing the components, the attributes are configured, the convenience and quickness are realized, the overall efficiency of developers can be ensured under the condition of saving time resources, and therefore, the problem that rendering data is directly returned according to the request of a user in the related technology is solved, once the table display content is empty, rendering resources are easily wasted, data request time is increased, and user experience is reduced.
Next, a presentation apparatus of table data proposed according to an embodiment of the present application is described with reference to the drawings.
Fig. 5 is a block diagram of a display device for table data according to an embodiment of the present application.
As shown in fig. 5, the apparatus 10 for displaying table data includes: the system comprises an acquisition module 100, a search module 200, a presentation module 300 and a reminder module 400.
In an embodiment of the present application, the display module 300 is configured to: detecting whether a cell with a data length exceeding a preset length exists in the table data; and when the cell with the data length larger than the preset length is detected, hiding the data with the length exceeding the preset length in the cell, and displaying all the contents of the cell in a floating manner when the display operation of the cell is identified.
In an embodiment of the present application, the apparatus for displaying table data further includes: the identification module is used for identifying the expansion intention of a user on a header in the form data after the form data is displayed on the interactive interface, wherein the header is an operation field with a drop-down box, and the drop-down box comprises a plurality of operation options; and the control module is used for controlling the expansion of the drop-down box of the header according to the expansion intention, identifying the operation intention of the user, selecting any one of the operation options according to the operation intention of the user, and executing target operation on the form data according to the selected operation option.
It should be noted that the explanation of the embodiment of the method for displaying table data is also applicable to the apparatus for displaying table data of the embodiment, and is not repeated herein.
According to the display device of the table data provided by the embodiment of the application, the rendering of the data by the table component in the device is verified through the search component, the table component not only comprises processing of displaying overlong table deformation on a data field, but also comprises operation to be performed by selecting buttons for table operation through a drop-down frame, so that an operation bar is not too bloated, and the display device of the table data also comprises processing of displaying overlong scroll bars on table positions, page jump for quickly finding needed data when the data amount is large and the like. Therefore, the problems that rendering data are directly returned according to the request of the user, rendering resources are easily wasted, data request time is prolonged, user use experience is reduced and the like in case that the table display content is empty in the prior art are solved.
Fig. 6 is a schematic structural diagram of an electronic device according to an embodiment of the present application. The electronic device may include:
memory 601, processor 602, and computer programs stored on memory 601 and executable on processor 602.
The processor 602 executes the program to implement the method for displaying tabular data provided in the above embodiments.
Optionally, the electronic device further comprises:
a communication interface 603 for communication between the memory 601 and the processor 602.
The memory 601 is used for storing computer programs that can be run on the processor 602.
The Memory 601 may include a high-speed RAM (Random Access Memory) Memory, and may also include a non-volatile Memory, such as at least one disk Memory.
If the memory 601, the processor 602 and the communication interface 603 are implemented independently, the communication interface 603, the memory 601 and the processor 602 may be connected to each other through a bus and perform communication with each other. The bus may be an ISA (Industry Standard Architecture) bus, a PCI (Peripheral Component interconnect) bus, an EISA (Extended Industry Standard Architecture) bus, or the like. The bus may be divided into an address bus, a data bus, a control bus, etc. For ease of illustration, only one thick line is shown in FIG. 6, but this is not intended to represent only one bus or type of bus.
Optionally, in a specific implementation, if the memory 601, the processor 602, and the communication interface 603 are integrated on a chip, the memory 601, the processor 602, and the communication interface 603 may complete mutual communication through an internal interface.
The processor 602 may be a Central Processing Unit (CPU), an Application Specific Integrated Circuit (ASIC), or one or more Integrated circuits configured to implement embodiments of the present Application.
The embodiment of the present application further provides a computer-readable storage medium, on which a computer program is stored, and when the computer program is executed by a processor, the method for displaying table data as above is implemented.
In the description of the present specification, reference to the description of "one embodiment," "some embodiments," "an example," "a specific example," or "some examples" or the like means that a particular feature, structure, material, or characteristic described in connection with the embodiment or example is included in at least one embodiment or example of the present application. In this specification, the schematic representations of the terms used above are not necessarily intended to refer to the same embodiment or example. Furthermore, the particular features, structures, materials, or characteristics described may be combined in any suitable manner in any one or N embodiments or examples. Furthermore, various embodiments or examples and features of different embodiments or examples described in this specification can be combined and combined by one skilled in the art without contradiction.
Furthermore, the terms "first", "second" and "first" are used for descriptive purposes only and are not to be construed as indicating or implying relative importance or implicitly indicating the number of technical features indicated. Thus, a feature defined as "first" or "second" may explicitly or implicitly include at least one such feature. In the description of the present application, "N" means at least two, e.g., two, three, etc., unless specifically limited otherwise.
Any process or method descriptions in flow charts or otherwise described herein may be understood as representing modules, segments, or portions of code which include one or more N executable instructions for implementing steps of a custom logic function or process, and alternate implementations are included within the scope of the preferred embodiment of the present application in which functions may be executed out of order from that shown or discussed, including substantially concurrently or in reverse order, depending on the functionality involved, as would be understood by those reasonably skilled in the art of the embodiments of the present application.
It should be understood that portions of the present application may be implemented in hardware, software, firmware, or a combination thereof. In the above embodiments, the N steps or methods may be implemented in software or firmware stored in a memory and executed by a suitable instruction execution system. If implemented in hardware, as in another embodiment, any one or combination of the following techniques, which are known in the art, may be used: a discrete logic circuit having a logic gate circuit for implementing a logic function on a data signal, an application specific integrated circuit having an appropriate combinational logic gate circuit, a programmable gate array, a field programmable gate array, or the like.
It will be understood by those skilled in the art that all or part of the steps carried by the method for implementing the above embodiments may be implemented by hardware related to instructions of a program, which may be stored in a computer readable storage medium, and when the program is executed, the program includes one or a combination of the steps of the method embodiments.
Although embodiments of the present application have been shown and described above, it is understood that the above embodiments are exemplary and should not be construed as limiting the present application, and that variations, modifications, substitutions and alterations may be made to the above embodiments by those of ordinary skill in the art within the scope of the present application.

Claims (10)

1. A method for displaying table data is characterized by comprising the following steps:
acquiring search content in a search box;
searching table data matched with the search content by using a preset search component;
and when the table data is matched, calling a preset rendering component to render the table data, and displaying the table data on an interactive interface, otherwise, when the calling function of the preset rendering component is not triggered, carrying out error reporting reminding through the preset searching component.
2. The method of claim 1, wherein the presenting the tabular data at an interactive interface comprises:
detecting whether a cell with a data length exceeding a preset length exists in the table data;
when the cell with the data length larger than the preset length is detected, hiding the data exceeding the preset length in the cell, and displaying all the contents of the cell in a suspension manner when the display operation of the cell is identified.
3. The method of claim 1, wherein invoking the preset rendering component to render the table data comprises:
detecting whether the preset rendering component has an interface without data or not;
and if so, generating a null array, and calling the rendering component by using the null array.
4. The method of claim 1, after the interactive interface presents the tabular data, further comprising:
identifying an expansion intention of a user on a header in the table data, wherein the header is an operation field with a drop-down box, and the drop-down box comprises a plurality of operation options;
controlling a drop-down frame of the header to be unfolded according to the unfolding intention, and identifying the operation intention of a user;
and selecting any one of the operation options according to the operation intention of the user, and executing target operation on the table data according to the selected operation option.
5. The method according to any one of claims 1 to 4, wherein the preset search component is encapsulated by a Table component and a Pagination component.
6. An apparatus for displaying tabular data, comprising:
the acquisition module is used for acquiring search contents in the search box;
the searching module is used for searching table data matched with the searching content by utilizing a preset searching component;
the display module is used for calling a preset rendering component to render the table data and displaying the table data on an interactive interface when the table data is matched;
and the reminding module is used for carrying out error reporting reminding through the preset search component while not triggering the calling function of the preset rendering component when the table data is not matched.
7. The apparatus of claim 1, wherein the presentation module is configured to:
detecting whether a cell with a data length exceeding a preset length exists in the table data;
when the cell with the data length larger than the preset length is detected, hiding the data exceeding the preset length in the cell, and displaying all the contents of the cell in a suspension manner when the display operation of the cell is identified.
8. The apparatus of claim 6, further comprising:
the identification module is used for identifying the expansion intention of a user on a header in the form data after the form data is displayed on an interactive interface, wherein the header is an operation field with a drop-down box, and the drop-down box comprises a plurality of operation options;
and the control module is used for controlling the drop-down box of the header to be expanded according to the expansion intention, identifying the operation intention of the user, selecting any one of the operation options according to the operation intention of the user, and executing target operation on the table data according to the selected operation option.
9. An electronic device, comprising: memory, processor and computer program stored on the memory and executable on the processor, the processor executing the program to implement the presentation method of tabular data according to any one of claims 1 to 5.
10. A computer-readable storage medium, on which a computer program is stored, the program being executed by a processor for implementing a presentation method of tabular data according to any one of claims 1 to 5.
CN202210844805.9A 2022-07-18 2022-07-18 Table data display method and device, electronic equipment and storage medium Pending CN115098512A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210844805.9A CN115098512A (en) 2022-07-18 2022-07-18 Table data display method and device, electronic equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210844805.9A CN115098512A (en) 2022-07-18 2022-07-18 Table data display method and device, electronic equipment and storage medium

Publications (1)

Publication Number Publication Date
CN115098512A true CN115098512A (en) 2022-09-23

Family

ID=83298426

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210844805.9A Pending CN115098512A (en) 2022-07-18 2022-07-18 Table data display method and device, electronic equipment and storage medium

Country Status (1)

Country Link
CN (1) CN115098512A (en)

Similar Documents

Publication Publication Date Title
US5873106A (en) Geometry management for displaying objects on a computer
CN110110174B (en) Data visualization page generation, monitoring and display method, browser and server
US6065012A (en) System and method for displaying and manipulating user-relevant data
US20230115491A1 (en) Information presentation method and apparatus, electronic device, and storage medium
CN111708537A (en) Page rendering method and device based on component template and readable storage medium
CN109254773A (en) Skeleton page generation method, device, equipment and storage medium
US9761204B1 (en) System and method for accelerated graphic rendering of design layout having variously sized geometric objects
CN112711372B (en) Page response method in visual impairment mode, computing device and computer storage medium
CN102982172A (en) Webpage search browser and webpage search method
CN109977318B (en) Book searching method, electronic device and computer storage medium
CN113010252B (en) Application page display method, electronic equipment and storage medium
CN110209447A (en) A kind of list page data display method and list page data presentation device
CN104216631A (en) Information exhibition method and information exhibition device
CN115098512A (en) Table data display method and device, electronic equipment and storage medium
CN109948133B (en) Data form realization method based on Layu
CN107621951A (en) A kind of method and device of view Hierarchical Optimization
CN114741079B (en) Software development method, platform, electronic device and computer readable storage medium
CN116821534A (en) Method and system for positioning webpage based on rolling loading
CN115291869A (en) Zero-code form generation method and system based on vue custom component
CN110658968B (en) Page turning processing method of photo e-book and electronic equipment
US20060173862A1 (en) Method and system for displaying context-sensitive columns in a table
CN114356327A (en) React visual area rendering method and device
CN112818193A (en) Historical browsing data display method and device
CN112799761A (en) Search bar generation method and device, electronic equipment and storage medium
CN116302193B (en) Method, device, equipment and storage medium for improving front-end table loading speed

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