Reactjs Resact text Fit在多模式下未正确拟合文本

我正在尝试使用支持多行的模块。但是，我的文本溢出了父div，而不是整齐地放入其中

我的代码摘录：

return(
    <div style={{margin: '10px', border: 'solid black 2px', width: '200px', height: '80px'}}>
        <Textfit mode="multi">
            The quick brown fox jumps over the lazy dog.  The quick brown fox jumps over the lazy dog.  The quick brown fox jumps over the lazy dog.
        </Textfit>
    </div>
)

返回(
敏捷的棕色狐狸跳过懒狗。敏捷的棕色狐狸跳过懒狗。敏捷的棕色狐狸跳过懒狗。
)

我看到的是：

文本不适用于

单一模式

并在单行上正确显示。但是，当我将其切换到

多

模式时，它的行为就好像我甚至没有使用

模块一样

附加说明：虽然上述文本是硬编码的，但实际文本将从数据库中动态提取

问题:

---

我做错了什么？如何修复此问题以使文本适合div容器的内部？

如果试图将其适合父div，则需要告诉Textfit组件高度将有多大

  return(
<div style={{margin: '10px', border: 'solid black 2px', width: '200px', height: '80px'}}>
    <Textfit mode="multi" style={{height: '80px'}}>
        The quick brown fox jumps over the lazy dog.  The quick brown fox jumps over the lazy dog.  The quick brown fox jumps over the lazy dog.
    </Textfit>
</div>

返回(
敏捷的棕色狐狸跳过懒狗。敏捷的棕色狐狸跳过懒狗。敏捷的棕色狐狸跳过懒狗。

---

)

您可以使用：

使

文本适合
知道父div的高度，也可以使父div
显示：flex

我不太清楚

Textfit

在引擎盖下是如何工作的，但这在几乎所有情况下都能正常工作

这里有一个小例子来说明

---

如果这不符合您的要求，请告诉我！：）

我不太明白你的意思。该组件应具有固定的宽度和高度，以便能够处理文本的自动拟合。向Texfit组件添加高度不会产生任何影响。此外，规格说明Textfit将文本适合父组件，因此我无法理解为什么需要为Textfit组件本身指定高度。可能的重复