본문 바로가기

FrontEnd/React

Implement multiple styles into the inner style prop

Inner style prop에 다중 스타일 적용 하기

 

Example 1)

Style object 에 특정 조건에 따라 스타일을 적용 시킬 경우.

style={ tempVaraiable ? {backGround: 'red'} : {background: 'blue'} }

 

Example 2)

Style object 에 특정 조건에 따라 다중 스타일을 적용 시킬 경우

style={Object.assign(
              { cursor: currentCellData.onClick ? 'pointer' : 'inherit' },
              currentCellData.style && currentCellData.style
            )}

 - 2개의 스타일 object 를 Object.assign() 을 통해 통합 하고 style prop 으로 전달