单击元素（'li'）后如何获取文本值？

Question

如果单击元素，如何在 Svelte 中获取文本值？

如果我点击元素 - li 项，我需要更新变量。

我的代码：

<script>
    let languages = ['sk','cz','en','at']
    let activeLang = 'en'
</script>
<ul>
    {#each languages as language }
    <li on:click={activeLang = ???} >{language}</li>
    {/each}
</ul>

非常感谢您的帮助。

Answer 1

on:click 返回一个 event 参数。然后，您可以使用 event.target.innerText.

访问 li 的 innerText

因此在您的示例中：

<script>
    let languages = ['sk','cz','en','at']
    let activeLang = 'en'
</script>

<ul>
    {#each languages as language }
    <li on:click={(event) => activeLang = event.target.innerText} >{language}</li>
    {/each}
</ul>

看看REPL。

但是由于您已经有了包含所需信息的 language 变量，只需在回调内部单击时将其分配给 activeLang：

<script>
    let languages = ['sk','cz','en','at']
    let activeLang = 'en'
</script>

<ul>
    {#each languages as language }
    <li on:click={() => activeLang = language} >{language}</li>
    {/each}
</ul>

参见REPL。

单击元素（'li'）后如何获取文本值？

Svelte how to get text value after click on element ('li')?

svelte