Svelte, on:click 事件在每个块内在页面加载时触发

Kar*_*dra 3 each events onclick pageload svelte

问题在于,由于某种原因,on:click 会在页面加载时触发。任何人都可以向我解释为什么会发生这种情况以及如何防止它发生,这样它只会在您实际选中该框时触发。只有当 on:click 位于每个块内时才会发生这种情况。

<script>
    function handleClick(number) {
        alert(number)
    }
    let numbers = [1,2,3,4,5,6]
</script>
{#each numbers as number}
    <input type=checkbox on:click={handleClick(number)}>
{/each}
Run Code Online (Sandbox Code Playgroud)

你可以在这里查看

Ric*_*ris 7

的值on:click应该是一个函数。你正在调用一个函数——这与做这样的事情没有什么不同......

<p>{a} + {b} = {sum(a, b)}</p>
Run Code Online (Sandbox Code Playgroud)

...正如您所料,它会打印调用sum函数的结果

相反,请执行以下操作:

<input type=checkbox on:click={() => handleClick(number)}>
Run Code Online (Sandbox Code Playgroud)