if:true for 循环内的比较答案

【问题标题】：if:true comparison inside the for loopif:true for 循环内的比较
【发布时间】：2021-12-30 10:01:50
【问题描述】：

我想在for:each 循环内的if:true 部分进行比较。我从谷歌得到的答案是创建一个新的子组件。但我真的不想走这条路……还有其他好的选择吗？

      <template for:each={listData} for:item="obj">
                                 <template if:true={obj.Id == CurrentId}>
      </template>

【问题讨论】：

标签： salesforce lwc

【解决方案1】：

Documentation

if:true|false={表达式} 使用此指令有条件地呈现模板中的 DOM 元素。表达式可以是 JavaScript 标识符（例如，person）或从对象 (person.firstName) 访问属性的点表示法。 引擎不允许计算表达式 (person[2].name['John'])。要计算表达式的值，请在 JavaScript 类中使用 getter。

您不能使用此类表达式，但可以向对象添加属性或 getter，其计算结果为布尔值。像这样的：

this.listData = this.listData.map((elem) => {
    const self = this;
    return {
        ...elem,
        get isCurrent() {
             return this.Id == self.CurrentId;
        }
    };
});

那么你可以使用<template if:true={obj.isCurrent}>。

【讨论】：