mirror of https://github.com/sveltejs/svelte
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
23 lines
405 B
23 lines
405 B
6 years ago
|
---
|
||
|
title: If blocks
|
||
|
---
|
||
|
|
||
|
HTML doesn't have a way of expressing *logic*, like conditionals and loops. Svelte does.
|
||
|
|
||
|
To conditionally render some markup, we wrap it in an `if` block:
|
||
|
|
||
|
```html
|
||
|
{#if user.loggedIn}
|
||
|
<button on:click={toggle}>
|
||
|
Log out
|
||
|
</button>
|
||
|
{/if}
|
||
|
|
||
|
{#if !user.loggedIn}
|
||
|
<button on:click={toggle}>
|
||
|
Log in
|
||
|
</button>
|
||
|
{/if}
|
||
|
```
|
||
|
|
||
|
Try it — update the component, and click on the buttons.
|