Svelte with JSON from API: {#each} only iterates array-like objects

Question

我正在通过 Svelte 的公式调用 API，并希望循环输出结果：


    <script> 
      let varHaystack,
        varNeedle,
        result,
        hasData,
        json = null;
      varHaystack = "lang";
      varNeedle = "php";
      async function doSearch() {
        const res = await fetch("https://dev.domain.de/test/api.php?search", {
          method: "POST",
          body: JSON.stringify({
            search: {
              needle: varNeedle,
              haystack: varHaystack,
            },
          }),
        });

        json = await res.json();
        result = JSON.stringify(json);
        hasData = true;
        console.log(json);
      }
    </script>

    <input placeholder="Needle" bind:value={varNeedle} />
    <input placeholder="Haystack" bind:value={varHaystack} />
    <button type="button" on:click|preventDefault={doSearch}> Post it. </button>

    <p>Result:</p>
    <pre>
      {result}
    </pre>

    <!-- first attempt -->
    {#if hasData}
      <div>
        {#await json}
          <p>Loading...</p>
        {:then json}
          {#each json as user}
            <p>Name is {user.lang}</p>
          {/each}
        {:catch error}
          <p style="color: red">{error.message}</p>
        {/await}
      </div>
    {/if}

    <!-- second attempt -->
    {#if hasData}
      {#each json as d}
        <tr>
          <td>{d.id}</td>
        </tr>
      {:else}
        <p>Loading...</p>
      {/each}
    {/if}

JSON 对象在控制台和 pre 标记中正确计时，只是不在两次循环尝试中。

总是报错： Uncaught (in promise) Error: {#each} only iterates over array-like objects.

作为字符串的 JSON 输出如下所示：
{ “8”：{ "日期": "1999-11-13 01:56:50", “lang”：“PHP” }, “12”：{ "日期": "1999-11-13 01:56:50", “lang”：“PHP” }

Answer 1

感谢@Felix Kling 的评论，这有效：

{#if hasData}
  {#each Object.values(json) as d}
    <tr>
      <td>{d._id}</td>
      <td>{d.desc}</td>
    </tr>
  {/each}
{:else}
  <p>Loading...</p>
{/if}

Svelte with JSON from API: {#each} only iterates array-like objects

Svelte with JSON from API: {#each} only iterates over array-like objects

foreach

json

loops

svelte