在React中将状态属性添加到内联样式

Question

我有一个具有这样的内联样式的react元素:(缩短版本)

      <div className='progress-bar'
           role='progressbar'
           style={{width: '30%'}}>
      </div>

我想用我的州的属性替换宽度,虽然我不太清楚如何做到这一点.

我试过了:

      <div className='progress-bar'
           role='progressbar'
           style={{{width: this.state.percentage}}}>
      </div>

这甚至可能吗？

Answer 1

你可以这样做

style={ { width: `${ this.state.percentage }%` } }

Example