Views e Markup do Verniz

Um componente Verniz é uma função Zolo que retorna View. Não há classe base, tabela de registro nem uma segunda linguagem de expressões.

Markup é Zolo¶

use std::html::{article, h2, p, View}

fn PostCard(titulo: str, resumo: str) -> View {
    <article class="post">
        <h2>{titulo}</h2>
        <p>{resumo}</p>
    </article>
}

O parser baixa isso para a mesma representação da sintaxe builder:

article(class: "post") {
    h2() { titulo }
    p() { resumo }
}

Use a forma mais clara. Componentes e elementos HTML seguem as mesmas regras de chamada, inclusive argumentos nomeados e valores padrão.

Texto, expressões e controle de fluxo¶

Dentro do markup, texto é literal. Chaves voltam para a linguagem Zolo completa:

fn Resultados(itens: [str], mostrar_vazio: bool) -> View {
    <section>
        {if itens.len() == 0 && mostrar_vazio {
            <p>Nenhum resultado.</p>
        }}
        {for item in itens {
            <p key={item}>{item}</p>
        }}
    </section>
}

Use comentários HTML dentro do markup: <!-- nota -->. Comentários Zolo // e /* */ são aceitos entre atributos da tag.

Seguro por padrão¶

Texto interpolado e atributos são escapados. Um título com <script> vira texto, não markup executável. Use raw(valor) somente para HTML que já atravessou uma fronteira de confiança com segurança.

Documentos, fragmentos e rotas¶

Use document, head e body para páginas completas, ou fragment para irmãos sem wrapper. render(view) serializa uma View explicitamente.

Uma rota HTTP pode retornar View diretamente. O servidor renderiza e escolhe o content type HTML. Ele também serve o runtime do Verniz em /_zolo/client.js quando a página inclui client_script().

Elementos de texto raw¶

Os corpos de <style> e <script> são lidos como CSS e JavaScript, não como markup. Um <style> estático dentro do componente é escopado e içado por padrão; escreva <style global> para CSS do documento.

Próximo: Ilhas, Signals e Actions.