Aprende Vue

Capítulo 7. Renderização avançada, componentes dinâmicos e composição de plug-ins

Este trabalho foi traduzido com recurso a IA. Agradecemos o teu feedback e comentários: [e-mail]

Nos capítulos anteriores, aprendeste como funciona o Vue, como compor componentes com a API Options e a API Composition, e como incorporar dados de um recurso externo na tua aplicação Vue utilizando o Axios.

Este capítulo apresentará um aspeto mais avançado da renderização no Vue. Exploraremos como computar componentes funcionais usando a função de renderização e JSX e como renderizar elementos de forma dinâmica e condicional usando a tag de componente do Vue. Também aprenderemos como registrar um plugin personalizado para uso dentro daaplicação.

A função Render e JSX

Com a API do compilador Vue, o Vue processa e compila todos os modelos HTML utilizados para um componente Vue no Virtual DOM após a renderização. Quando os dados de um componente Vue são actualizados, o Vue acciona a função de renderização interna para enviar o valor mais recente para o Virtual DOM .

Usar template é a abordagem mais comum para criar um componente. No entanto, precisamos ignorar o processo do analisador de modelos HTML em cenários específicos, como otimizar o desempenho, trabalhar em um aplicativo de renderização do lado do servidor ou trabalhar em uma biblioteca de componentes dinâmicos. Ao retornar o nó virtual renderizado diretamente do Virtual DOM e ignorar o processo de compilação de modelos, ...