Pular para conteúdo

Exercícios 04 - Reatividade no Svelte ⚡

🟢 Básicos

  1. Gatilho: O que dispara uma atualização automática na interface do Svelte? (Dica: pense no operador =).
  2. Sintaxe $:: Para que serve o prefixo $: no Svelte?

🟡 Intermediários

  1. Variáveis Dependentes: Crie um exemplo de código onde uma variável total é sempre igual à soma de preco e taxa, usando reatividade.
  2. Logs Reativos: Como você usaria a sintaxe $: para imprimir o valor de uma variável no console toda vez que ela mudar?

🔴 Desafio

  1. Lógica de Negócio Reativa: Crie um componente que simule um carrinho de compras simples:
    • Tenha uma variável quantidade (inicie em 1) e uma variável precoUnitario (ex: 50.0).
    • Crie uma variável reativa subtotal que calcule o preço total.
    • Crie um bloco reativo $: { ... } que verifique: se o subtotal passar de 100, exiba um aviso (pode ser um texto na tela ou um console.log) dizendo "Você ganhou frete grátis!".
    • Adicione botões para aumentar e diminuir a quantidade.