我有一个组件,我试图设置宽度的基础上的结果,一个变量。
该变量返回一个1到100之间的数字,因此我想设置宽度以反映变量的结果。
然而,尽管能够在组件中呈现结果,但我不能设置宽度。这是我第一次尝试有条件地呈现React组件的宽度,所以我认为我做了一些明显的错误。
下面是有问题的render函数:
const fetchLoans = this.state.debts.map(debt => {
const loanBalance = debt.balance
const loanBorrowed = debt.borrowed
const loanSum = Math.round(loanBalance / loanBorrowed * 100)
return (<div className="individual-loan-amount-outstanding" key={debt._id}>
<div className="individual-loan-amount-bar">
<div className="individual-loan-amount-indicator" style={{ width: {loanSum} }}>{loanSum}%</div>
</div>
</div>
)
})
字符串
正如你所看到的,我试图根据“loansum”的结果设置“width”。
我可以在div中呈现'loanSum',但不能使用宽度。
有谁能指出我哪里做错了吗?
谢谢你,谢谢
2条答案
按热度按时间798qvoo81#
你不应该在
loanSum
周围加上花括号,所以你的行应该是:字符串
8aqjt8rx2#
以%为单位设置值我就是这么做的
字符串