Cómo importar componentes en Svelte

Aprenda a importar componentes en Svelte

Svelte ofrece componentes de un solo archivo. Cada componente se declara en un .sveltearchivo, y allí se puede escribir el código HTML, el CSS y el JavaScript necesarios.

A continuación se muestra un ejemplo simple de un componente Svelte, que se encuentra en un archivo llamado Button.svelte:

buttonA button/button

Puedes agregar CSS y JS a este componente, pero este marcado HTML simple ya es el marcado del componente , no hay necesidad de envolverlo en otra etiqueta especial ni nada.

Para exportar este marcado desde este componente, no es necesario hacer nada. Ahora puede importarlo a cualquier otro componente de Svelte utilizando la import ComponentName from 'componentPath'sintaxis:

scriptimport Button from './Button.svelte';/script

Y ahora puedes usar el componente recién importado en el marcado, como una etiqueta HTML:

Button /

Tal vez te puede interesar:

1. Introducción a React
2. Agregar evento de clic a los elementos DOM devueltos desde querySelectorAll
3. Cómo cambiar el valor de un nodo DOM
4. Cómo comprobar si un elemento DOM tiene una clase