Data List
Data List
- Ant Design
- Global Styles
- Design Patterns
- Design Patterns (Research)
- Overview
- Template Document
- Global Rules
- Visualization
- Motion
- Illustrations
Emphasis on browsing. The matrix layout tends to display complex data, and the data is aligned according to the matrix layout, which is convenient for browsing data horizontally and vertically, and studying the relationship between data. Tables are used especially when the user would benefit from more data exposure without having to go into the details of the object.
Consider both browsing and presentation. Arranged vertically, it tends to show the basic overview of the object, and the content is displayed hierarchically, which is suitable for quick scanning. Especially when the display space is limited, such as smaller pop-up windows, sidebars, drop-down panels and other containers, use lists.
Emphasis on presentation. The grid layout has no specific browsing order, and each object has a more equal display opportunity. The grid layout is more attractive on the page and is suitable for highlighting objects.
Select the appropriate search component.
1）Identify the main search patterns of users.
2）The higher the search frequency, the higher the efficiency requirements.
3）Communicate well with developers to understand system performance and select appropriate components.
According to the preset conditions, select multiple query conditions and submit the acquisition query at one time.
Users adjust the filters and the results adjust accordingly.
Smarter search, enter keywords to query in multiple data attributes at one time, and display the results.
By default, page loading is used to reduce user waiting. The user's browsing position in the original list should be cached, and the browsed items in the list should be marked. When the user returns to the previous page, the user returns to the original browsing position.
Recommended by default. When used, when the content of the page is less than one page, the pager will not be displayed.
This mode can be considered when users can often find the desired item at the top of the list and there is no need to locate a specific list item, such as dynamics and emails.
Use when you need to jump to the page to view the complete list.
When the user checks the item, the batch operation mode is triggered, and the list toolbar calls out the batch operation toolbar.
Click to trigger a new form pop-up window, drawer, page, etc. After the creation is completed, the newly created content appears in the first item of the list and is briefly highlighted.
Click New, and the object editing area will appear at the button position, and the newly created object will be displayed at this position after the creation is completed. The dotted new button position is placed at the beginning or end of the list.
After deletion, allow user to undo.
When clicking the delete operation, a second confirmation is required.
Destructive operations require high-level security verification to confirm operations.
Common features needed to integrate lists in a small space, highly recommended.
List layouts are usually tiled from top to bottom, in the following order. Among them, the exclusive area provides an expansion space for solving complex data search and data statistics content that cannot be integrated in the toolbar.
When the list has no data or no search results, an empty state should be displayed.