Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 | 1x 1x 1x | import React, { Fragment } from "react"; import { Tooltip } from "@tencent/tea-component/lib/tooltip"; import { Text } from "@tencent/tea-component/lib/text"; import { Button } from "@tencent/tea-component/lib/button"; import { Modal } from "@tencent/tea-component/lib/modal"; export default function TooltipExample() { const longContent = "张三,李四,流五,陈六,赵七,王八,李九"; const tooltipContent = ( <Tooltip title={longContent}> <Text verticalAlign="middle" style={{ maxWidth: 100 }} overflow> {longContent} </Text> </Tooltip> ); return ( <Fragment> <section> <Text verticalAlign="middle" theme="label"> 联系人: </Text> {tooltipContent} <Button onClick={() => Modal.success({ message: "查看联系人", description: tooltipContent, }) } > 在对话框中查看 </Button> </section> </Fragment> ); } |