mirror of
https://github.com/sveltejs/svelte.git
synced 2024-12-01 17:30:59 +01:00
Merge branch 'docs/2640' of https://github.com/varholak-peter/svelte into varholak-peter-docs/2640
This commit is contained in:
commit
8c9da2fa85
@ -1261,3 +1261,46 @@ The `<svelte:options>` element provides a place to specify per-component compile
|
||||
```html
|
||||
<svelte:options tag="my-custom-element"/>
|
||||
```
|
||||
|
||||
|
||||
### @debug
|
||||
|
||||
```sv
|
||||
{@debug variable}
|
||||
```
|
||||
```sv
|
||||
{@debug var1, var2, ..., varN}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
The `{@debug ...}` tag offers an alternative to `console.log(...)`. It allows you to inspect the value of a specific variable, but additionally pauses code execution when you have devtools open.
|
||||
|
||||
```html
|
||||
<script>
|
||||
let user = {
|
||||
firstname: 'Ada',
|
||||
lastname: 'Lovelace'
|
||||
};
|
||||
</script>
|
||||
|
||||
{@debug user}
|
||||
|
||||
<h1>Hello {user.firstname}!</h1>
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
`{@debug ...}` can also accept a comma-separated list of values, however it accepts only variable identifiers, and as such does not support inspecting of expressions.
|
||||
|
||||
```sv
|
||||
# Compiles
|
||||
{@debug user}
|
||||
{@debug user1, user2, user3}
|
||||
|
||||
# WON'T compile
|
||||
{@debug user.firstname}
|
||||
{@debug myArray[0]}
|
||||
{@debug !isReady}
|
||||
{@debug typeof user === 'object'}
|
||||
```
|
||||
|
Loading…
Reference in New Issue
Block a user