使用 Svelte 逐行写入文本文件的内容

Question

我用 svelte 编写了这段代码，打开一个 txt 文件，并将其写在 html 段落中。这是代码：

<input type='file' multiple bind:files'>

{#if files}
    <h2>Files selected: </h2>
{#each Array.from(files) as file}
<p> IThe imported file is: {file.name}</p>
{#await file.text() then text}
<p>{text}</p>
{/await}
{/each}
{/if}

示例文件是这样的：

beans
spam
donut

但它给了我这个：

beans spam donut

如何为文本中的每一行创建一个新行（段落或 <br>）？

Answer 1

这个怎么样？只需在换行符上拆分并创建一个新的 p 标签。

<script>
    let files;
</script>

<input type='file' multiple bind:files />

{#if files}
    <h2>Files selected: </h2>
{#each Array.from(files) as file}
<p> IThe imported file is: {file.name}</p>
{#await file.text() then text}
{#each text.split('\n') as line }
<p>{line}</p>
{/each}
{/await}
{/each}
{/if}

使用 Svelte 逐行写入文本文件的内容

Write the content of a text file line by line with Svelte

svelte