簡體   English   中英

如何切換antd Typography.Paragraph ellipsis

[英]How to toggle antd Typography.Paragraph ellipsis

我正在使用<Typography.Paragraph>組件來顯示列表中某些項目的描述。 我想將描述中的行數限制為 2。

現在我可以使用<Typography.Paragraph>ellipsis屬性將描述限制為僅顯示 2 行並將其設置為可擴展。 但是,我似乎無法找到一種方法將文本折疊回僅有 2 行的省略號(...)

這是我當前代碼的片段。

const listOfLongText = [.....];

listOfLongText.map((text,i) => {
    <Paragraph ellipsis={{ rows: 2, expandable: true }}> 
        {text}
    </Paragraph>
})

我知道Paragraphellipsis道具的onExpand回調,但不確定如何使用onExpand在展開和折疊功能之間進行切換

<Typography.Paragraph> API 在這里定義


如果您需要更多信息,請發表評論,我會提供。

當前的antd版本( 3.23.4 )沒有這個選項。

您需要通過 state 控制它,例如:

<Paragraph
  ellipsis={{
    rows: 3,
    expandable: true,
    onExpand: this.typoExpand
  }}
>
  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>;

編輯 Q-58151314-ExpandEllipsis

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM