CODEWITHSUNDEEP
htmlreactjs
Zurch
Zurch

Reputation: 39

Mixin text html into a conditional react statement

I'm Very new to react and I have a conditional statement in react in a table cell and when user are in the the Search nav it shows the birthdate that's coming up fine however getting errors when I simply like to mix in text element the word "birthday" beside the date.

the string below:

cell: (row) => (
                <>
                    <div class="dob">{`${row.firstName} ${row.lastName} ${
                        history.location.pathname.toLowerCase().includes('search') && row.maidenName ? `(${row.maidenName})` : ''
                    }
                    
                  `}</div>
                    <div>{`${history.location.pathname.toLowerCase().includes('search') && row.birthdate ? formatDate(new Date(row.birthdate)) : ''}
                  `}</div>
                </>
            ),

Upvotes: 0

Views: 36

Answers (1)

Daniel Karlsson
Daniel Karlsson

Reputation: 182

I don't know if this is what you wanted to do, but here's how I would display the word "Birthday" besides the date:

cell: (row) => {
let maidenName = (history.location.pathname.toLowerCase().includes('search') && row.maidenName) ? row.maidenName : '';
let birthdate = (history.location.pathname.toLowerCase().includes('search') && row.birthdate) ? formatDate(new Date(row.birthdate)) : '';

return <>
        <div class="dob">{`${row.firstName} ${row.lastName} ${maidenName}`}</div>
        <div>{`Birthday: ${birthdate}`}</div>
</>

}

Upvotes: 1

Related Questions