How to check print friendly value using If else condition in render function

Question

How to check conditions in render function to print friendly names For example if (value = 101) then “some text”, else if (value = 102) then “Another text” etc. Please check below the code I am trying.

public render(): React.ReactElement<IGetSpListsProps> {
return (
<div>
<ol>
{
this.state.sitecontents.map(function(mylists,mylistitemkey){
return(
<li>
  <span>{mylists.Title}</span> //here it will display list titles
  
  if({mylists.BaseTemplate} = {'101'} // basetemplate will return int number like 100, 101, 103 etc so checking the condition with 101
  {
    <p>{"Generic List template"}</p>
  }
  else if ({mylists.BaseTemplate} = {'102'}) {
    <p>{"Document List template"}</p>
  } else {
    <p>{"Custom template"}</p>
  })
  
  </li>);
  })
}</ol></div>
  );

{mylists.BaseTemplate} will return the template number so I want to print the friendly name of that template number, I am trying to print but it is not expected. Please check how the output is displayed If we see the screenshot below, the condition is treated as simple text

How to use if else to check conditions Or is there any way to create a file/Json value and lookup from that file to get the corresponding friendly string?

Answer 1

Have you tried Status? You can get this idea here