如何在ReactJS中减小字体大小

Question

我的应用货币转换器每次在输入中添加或删除数字时都会更新结果（事件onChange）。

问题是，如果您添加一些数字，结果的大小会增加，因此我想根据需要更改字体大小。 （更大或更小取决于）

有什么主意吗？

Answer 1

我认为您需要启动状态：

const[isBig,setIsBig()] = React.useState(false);

之后，您需要检查结果的大小，并取决于输出更新的大小isBig（您的状态）

就是这样，如果isBig true设置fontSize：12px否则为15px或我不知道取决于您的需求：

<span style={isBig ? {fontSize:'12px'} : {fontSize:'15px'}}>your resulsts here </span>

Answer 2

我认为当我创建一个新的render（）时，我将对字符进行计数，并根据字符串的长度更改字体大小。

我这样计算我的新字体大小：

newSize = parseInt(400/res.length);

在JSX渲染中，我这样做了：

<div className='overflow' id="result" style={{fontSize: newSize+'px'}}>
    {res}
</div>