A better way to render component ? React [closed]
I need a better way to render this component so I need advice.
Check my code:
renderComponent = () => {
if(id){
return <Placeholder> { id } </Placeholder>
} else if(date) {
return <Placeholder> This is date { date } </Placeholder>
} else if (testData === 'test'){
return <TestDataComponent></TestDataComponent>
}
}
Maybe a switch would be a better a way? I am using ternary operator but here is three values... maybe I need to add one more conditional.
I want to say this is work , but just need be refactor and write on better a way.
Solution 1:
As you return specific component, so you can use just form 3 if blocks which if had true condition then return the component
const renderComponent = () => {
if(id){
return <Placeholder> { id }</Placeholder>
}
if(date) {
return <Placeholder> This is date { date }</Placeholder>
}
if (testData === 'test'){
return <TestDataComponent />
}
}