2 回答

TA貢獻(xiàn)1853條經(jīng)驗(yàn) 獲得超9個(gè)贊
當(dāng)您設(shè)置on:click為 時(shí)toggleView(line1),該函數(shù)會(huì)立即執(zhí)行,就像您將其設(shè)置為toggleView()而不是toggleView在其他工作示例中一樣。
您有兩種方法可以解決此問(wèn)題。最常見(jiàn)的方法是將on:click處理程序轉(zhuǎn)變?yōu)?lambda/匿名函數(shù):
<button on:click="{() => toggleView(line1)}">{line1.display}</button>
另一種不太常見(jiàn)的方法是修改處理函數(shù)并將其轉(zhuǎn)換為柯里化函數(shù):
function toggleView(field) {
return function() {
field.visible = !field.visible;
if(!field.visible) field.display = "*************"
else field.display = field.originalText
};
};
在這種情況下on:click={toggleView(field)},將返回一個(gè)綁定到單擊處理程序的函數(shù),并且該函數(shù)將在單擊按鈕時(shí)實(shí)際執(zhí)行。

TA貢獻(xiàn)1848條經(jīng)驗(yàn) 獲得超10個(gè)贊
在原始 HTML + JS 中,內(nèi)聯(lián)事件處理程序?qū)嶋H上onclick
是在事件發(fā)生時(shí)將執(zhí)行的一段代碼。特別是,如果您在處理程序中使用函數(shù),則必須調(diào)用它:
示例(不是 Svelte):
<button onclick="toggleView()" />
相反,在 Svelte 中,事件處理程序應(yīng)該是一個(gè)函數(shù),它將在事件發(fā)生時(shí)被調(diào)用。
好的,因?yàn)?code>toggleView是一個(gè)函數(shù):
<button on:click={toggleView} />
不好,因?yàn)樗?code>toggleView()每次渲染標(biāo)記時(shí)都會(huì)調(diào)用(即當(dāng)響應(yīng)式變量更改時(shí)),并且 _the 的返回值togggleView()
綁定到click
事件:
<button on:click={toggleView()} />
如果您需要將本地參數(shù)傳遞給事件處理程序,那么您需要包裝該函數(shù)以仍然獲得您想要的內(nèi)容(在事件發(fā)生時(shí)調(diào)用整個(gè)函數(shù),而不是在重新調(diào)用標(biāo)記時(shí)調(diào)用):
示例,OK + 參數(shù):
<button on:click={() => toggleView(line1)} />
請(qǐng)注意,這里的處理程序是() => toggleView(line1)
,而不是toggleView(line1)
。
添加回答
舉報(bào)