Search code examples
templatesjsxhbs

Convert template in .hbs to .jsx


I have a template file in .hbs, i need to convert to .jsx , but i have difficulty in the if else condition for th element in table.

This is in .hbs

  <tr>
  <th> Amount </th>
  {{#if show_trust}}
     <th>
         Trust Account
     </th>
     <th>
         Trust Balance
     </th>
  {{/if}}
  </tr>

What I have tried in .jsx, one of them is below.

<tr>
<th> Amount </th>
{show_trust && <th>Trust Account</th>}
{show_trust && <th>Trust Balance</th>}
</tr>


Solution

  • i have found working solution in jsx but could be more elegant

    <tr>
    <th> Amount </th>
    {(() => {
              if (show_trust) {
                       return (
                           <th>Trust Account</th>
                       )
                   }
               })()}
               
    {(() => {
                   if (show_trust) {
                       return (
                           <th>Trust Balance</th>
                       )
                   }
             })()}
    </tr>