【问题标题】:Put ellipsis on react svg text component将省略号放在反应 svg 文本组件上
【发布时间】:2016-01-29 16:55:41
【问题描述】:

我需要您的帮助,因为我在使用 react 的 svg 文本组件时遇到了一些问题。 我正在尝试呈现具有固定宽度的文本标签。但是如果文本太长,我无法找到在标签上添加省略号的方法。

var label = "Here is a really long text";
<text width={10}>{label}</text>

应该呈现为

<text width={10}>Here is a really...</text>

解决此问题的更好方法是什么? 感谢您的帮助

【问题讨论】:

    标签: javascript svg reactjs


    【解决方案1】:

    不知道它是否适用于文本标签,但请尝试将此样式添加到文本中。

    let textSty = {
      overflow: 'hidden',
      textAlign: 'left',
      textOverflow: 'ellipsis',
      whiteSpace: 'nowrap'
    }

    【讨论】:

    • 感谢 Janaka,我尝试了您的解决方案,但不幸的是,似乎没有可用于文本元素的样式来获得预期的结果。
    • 嗨 janaka,对不起,我在上一句中的意思是,这种样式似乎不能应用于文本元素,因为这些属性不适用于文本元素
    猜你喜欢
    • 2022-01-23
    • 2013-04-05
    • 2022-01-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-07-22
    • 1970-01-01
    相关资源
    最近更新 更多