在 Fetch 调用中遍历数组

Question

我有一个像这样的 JSON 对象：

[{"user": "poetry2", "following": ["Moderator", "shopaholic3000"]}]

我正在使用这样的 Fetch API：

    fetch (`/profile/${username}/following`)
    .then(response => response.json())
    .then(profiles => {
        profiles.forEach(function(profile){
            profileDisplay = document.createElement('button');
            profileDisplay.className = "list-group-item list-group-item-action";
            profileDisplay.innerHTML = `
            ${profile.following}`;
            listFollowing.appendChild(profileDisplay);
        })

    })

现在，它在同一个按钮中显示以下两个用户：

<button class="list-group-item list-group-item-action">
            Moderator,shopaholic3000</button>

如何修改 Fetch 调用以在单独的按钮中显示以下每个用户。更像是这样的：

<button class="list-group-item list-group-item-action">
            Moderator</button>
<button class="list-group-item list-group-item-action">
            shopaholic3000</button>

Answer 1

所以你需要做第二个循环来遍历下面的数组

profiles.forEach(function(profile){
  profile.following.forEach(name => {
    const profileDisplay = document.createElement('button');
    profileDisplay.innerHTML = `${name}`;
    ....
  });
});

在 Fetch 调用中遍历数组

Iterating over an array in a Fetch call

javascript

arrays

createelement

fetch-api