CODEWITHSUNDEEP
reactjs
Abhishek kamal
Abhishek kamal

Reputation: 482

Add className dynamically to classbased component

I am rendering a class based component <LiveChat customClassName="live-chat-wrapper" />. As you can see I am sending customClassName as a prop to the LiveChat component. LiveChat component returns -
<div className={"chat-box " + this.props.customClassName}>CHAT</div>
It is working perfectly, but If I don't send customClassName as a prop to the LiveChat (rendering only <LiveChat />) then it is adding undefined in place of this.props.customClassName.

I want to stop showing undefined, If I don't send any customClassName as a prop. How to do this ?

Upvotes: 0

Views: 75

Answers (1)

vishwas meshram
vishwas meshram

Reputation: 336

You should use template literals to achieve it.

<div className={`chat-box ${this.props.customClassName || ''}`}>CHAT</div>

Upvotes: 1

Related Questions