Adding an attribute in a <div> if the attribute has value [duplicate]

Question

I am new to web development, so this is probably pretty fundamental. I want to add a data attribute to the div tag if the datainfo prop variable is not empty

<div style={{height: props.height - handleHeight()}} data={datainfo ? datainfo : ""}>

But right now the data attribute is added with an empty value if the datavalue is empty. Instead I want it to not appear in the div tag at all.

Can I add the whole thing in the JSX clause or how to do it?

thibpat · Accepted Answer · 2019-03-28 12:10:42Z

3

According to this other answer, you should put false instead of "".

<div style={{height: props.height - handleHeight()}} data={datainfo ? datainfo : false}>

answered Mar 28, 2019 at 12:10

thibpat

7865 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Chris Over a year ago

You should add that null and undefined are acceptable values as well. Personally, I'd rather use null here, rather than false. But that's just my preference.

Kasper Hansen Over a year ago

Thanks. data={datainfo} seems to work. But data={datainfo ? datainfo : false} does not. It results in data=false

Collectives™ on Stack Overflow

Adding an attribute in a <div> if the attribute has value [duplicate]

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related