React+Typescript 条件渲染

Question

我想为我拥有的每个配置文件创建一个选项。我检查了一下，我确实有一个配置文件，因此配置文件数组不为空并且 profile.profilename 不是未定义的。它只是不呈现。

我看到的： Picture

<div className="col-4">
   <select name="profile" className="billingSelector">
         <option>Billing profile</option>
             {(getProfiles() as any).forEach((profile:Profile) => {
                  <option>{profile.profileName}</option>
              })}
   </select>
</div>

Answer 1

我找到了解决办法。我使用 map 而不是 foreach，我删除了大括号并使用了常规大括号。

<select name="profile" className="billingSelector">
   <option>Billing profile</option>
   {getProfiles().map((profile:Profile)=> (
        <option key={profile.profileName}>{profile.profileName}</option>
   ))}       
</select>

Answer 2

使用 map 而不是 foreach。

有区别。映射 returns 列表，foreach - 不是。

更多信息：

Array.prototype.forEach() - JavaScript | MDN

Array.prototype.map() - JavaScript | MDN

Answer 3

您可以试试 map 而不是 foreach 吗？例如

getProfiles().map((配置文件, 索引) => ( {profile.profileName}));