Javascript 如何使用省略号显示JSX中的最后6个字符？

我是JavaScript新手，我学会了如何使用JSX呈现HTML代码。我在HTML中传递Span元素中的字符串，但是我只希望信息的最后6个字符显示在网页上。所以我尝试使用省略号属性来做，但是字符的数量并没有减少。我需要data.id仅为传递字符串的最后6个字符。我该怎么做？我可以使用省略号属性来实现这一点，还是应该在JSX中使用一些JavaScript函数？我不知道为什么CSS不起作用。有人能帮忙吗

.branchText{ 颜色：var secondaryHeader； 最大宽度：calc100%-16px； 溢出：自动； 空白：预包装； 断字：断字； 文本溢出：省略号； 显示：-网络工具包盒； -webkit线夹：2个； -网络工具包盒方向：垂直； 溢出：隐藏； } 大师： {data.get'id'} 只要做npm我反应行省略号-保存和使用像这样

import LinesEllipsis from 'react-lines-ellipsis'

<LinesEllipsis
   text='long long text'
   maxLine='3'
   ellipsis='...'
   trimRight
   basedOn='letters'
/>

---

不确定是否可以使用CSS仅显示最后6个字符，它通常基于宽度，因此可以使用JavaScript：

这将仅显示最后6个字符：

<span>
  {data.get('id').substr(data.get('id').length - 6)}
</span>

使用if语句，如果id超过6个字符，它将添加省略号

<span>
  {data.get('id').length > 6 ? "..." + data.get('id').substr(data.get('id').length - 6) : data.get('id')}
</span>