1.Tooltip text prompt
Simple text hint bubble box.
2. When to use
·When the mouse is moved in, the prompt will be displayed, and it will disappear when the mouse is moved out, and the floating layer of the bubble does not carry complex text and operations.
·It can be used to replace the system's default title prompt and provide a text explanation of the button/text/operation.
The component code comes from: Text Prompt Tooltip - Ant Design
3. Preparation before local verification
Refer to the article [react project + antd component-demo:hello-world react project + antd component-demo:hello-world_Western Jin’s no1 blog-CSDN blog ], and prompt the text Tooltip - the code that needs to be used locally in Ant Design Copy and cover all the codes in App2.js , start the code, you can view the phenomenon and change the code locally.
4. Simple usage of local verification Tooltip.
Copy the code shown in the figure below to understand the simple usage of Tooltip.
5. View the method of setting the 12 directions of the bubble: placement
Copy the code shown in the figure below to learn how to set the 12 directions of the bubble: placement.
The position of the bubble box, optional top left right bottom topLeft topRight bottomLeft bottomRight leftTop leftBottom rightTop rightBottom.
For specific usage, refer to the source code below.
This article only introduces part of the component Tooltip. For more information, please refer to the official document: Text Prompt Tooltip - Ant Design