Javascript：在 var 声明中使用条件

Question

我需要在包含一些变量的模板中声明一个 email 模板供以后使用（用于 send_email API 调用）。 我的问题是如何根据某些条件跳过 HTML 部分。 （ this.var部分来自 vuejs）或者是否有更好的方法来做到这一点？

例如：

  let email_template = `
    <table>
      <tr><td><b>Submitor</b></td><td>${this.loginUser.username}</td></tr>
      <tr><td><b>Order Type</b></td><td>${this.order}</td></tr>
      <tr><td><b>Goods</b></td><td>${this.goods}</td></tr>
      <tr><td><b>Fee</b></td><td>${this.fee} </td></tr>
    </table>
    <p>Please let me know if you have any questions.</p>
  `;

如果${isFree}为真，如何不包括费用表记录？

Answer 1

您可以在fee部分嵌套另一个模板文字，并列出费用<tr>或空字符串：

let email_template = `
<table>
  <tr><td><b>Submitor</b></td><td>${this.loginUser.username}</td></tr>
  <tr><td><b>Order Type</b></td><td>${this.order}</td></tr>
  <tr><td><b>Goods</b></td><td>${this.goods}</td></tr>
  ${isFree ? '' : `<tr><td><b>Fee</b></td><td>${this.fee} </td></tr>`}
</table>
<p>Please let me know if you have any questions.</p>
`;

Answer 2

您也可以使用此语法。 这里的字符串添加是通过 if 条件检查完成的；

let email_template = "";

email_template = email_template + `
       <table>
             <tr><td><b>Submitor</b></td><td>${this.loginUser.username}</td></tr>
             <tr><td><b>Order Type</b></td><td>${this.order}</td></tr>
             <tr><td><b>Goods</b></td><td>${this.goods}</td></tr>`;                     
if(!isFee)
{
   email_template = email_template + `
              <tr><td><b>Fee</b></td><td>${this.fee} </td></tr>
           </table>`;
}