在React中将State属性添加到内联样式 [英] Add a State property to an Inline Style in React

问题描述

我有一个具有以下内联样式的react元素:(精简版)

I have a react element that has an inline style like this: (Shortened version)

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

尽管我不太确定如何执行此操作，但我想用状态中的属性替换宽度.

I want to replace the width with a property from my state, although I'm not quite sure how to do it.

我尝试过:

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

这有可能吗?

推荐答案

您可以这样做

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

Example

这篇关于在React中将State属性添加到内联样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！