Svelte The @debug tag

有時，在數(shù)據(jù)流經(jīng)您的應(yīng)用程序時檢查它很有用。

一種方法是在標(biāo)記中使用 ?console.log(...)? 。但是，如果你想暫停執(zhí)行，你可以使用 ?{@debug ...}? 標(biāo)簽和你想要檢查的以逗號分隔的值列表：

{@debug user}

<h1>Hello {user.firstname}!</h1>

如果您現(xiàn)在打開您的開發(fā)工具并開始與 ?<input>? 元素交互，您將在?user?值更改時觸發(fā)調(diào)試器。

示例代碼

• App.svelte

<script>
	let user = {
		firstname: 'Ada',
		lastname: 'Lovelace'
	};
</script>

<input bind:value={user.firstname}>
<input bind:value={user.lastname}>

{@debug user}

<h1>Hello {user.firstname}!</h1>