mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-04 08:59:40 +08:00
55 lines
2.2 KiB
TypeScript
55 lines
2.2 KiB
TypeScript
import React, { useState } from 'react';
|
|
import { Switch, Typography } from 'antd';
|
|
|
|
const { Paragraph, Text } = Typography;
|
|
|
|
const App: React.FC = () => {
|
|
const [ellipsis, setEllipsis] = useState(true);
|
|
|
|
return (
|
|
<>
|
|
<Switch
|
|
checked={ellipsis}
|
|
onChange={() => {
|
|
setEllipsis(!ellipsis);
|
|
}}
|
|
/>
|
|
|
|
<Paragraph ellipsis={ellipsis}>
|
|
Ant Design, a design language for background applications, is refined by Ant UED Team. Ant
|
|
Design, a design language for background applications, is refined by Ant UED Team. Ant
|
|
Design, a design language for background applications, is refined by Ant UED Team. Ant
|
|
Design, a design language for background applications, is refined by Ant UED Team. Ant
|
|
Design, a design language for background applications, is refined by Ant UED Team. Ant
|
|
Design, a design language for background applications, is refined by Ant UED Team.
|
|
</Paragraph>
|
|
|
|
<Paragraph ellipsis={ellipsis ? { rows: 2, expandable: true, symbol: 'more' } : false}>
|
|
Ant Design, a design language for background applications, is refined by Ant UED Team. Ant
|
|
Design, a design language for background applications, is refined by Ant UED Team. Ant
|
|
Design, a design language for background applications, is refined by Ant UED Team. Ant
|
|
Design, a design language for background applications, is refined by Ant UED Team. Ant
|
|
Design, a design language for background applications, is refined by Ant UED Team. Ant
|
|
Design, a design language for background applications, is refined by Ant UED Team.
|
|
</Paragraph>
|
|
|
|
<Text
|
|
style={ellipsis ? { width: 200 } : undefined}
|
|
ellipsis={ellipsis ? { tooltip: 'I am ellipsis now!' } : false}
|
|
>
|
|
Ant Design, a design language for background applications, is refined by Ant UED Team.
|
|
</Text>
|
|
|
|
<Text
|
|
code
|
|
style={ellipsis ? { width: 200 } : undefined}
|
|
ellipsis={ellipsis ? { tooltip: 'I am ellipsis now!' } : false}
|
|
>
|
|
Ant Design, a design language for background applications, is refined by Ant UED Team.
|
|
</Text>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default App;
|