Lo que estoy tratando de lograr es pasar el componente a una cadena de una variable o alguna solución similar. Probé {@html someVariable} pero solo funciona para mí de una manera: significa texto de cadena a HTML. Pero necesito el texto de HTML a cadena. Probé document.elementById() pero siempre obtengo el mensaje de retorno 'el documento no está definido'. Aquí hay un ejemplo de lo que estoy tratando de lograr:
App.svelte <script> import Component from './component.svelte'; import Description from '.description .svelte'; // How to declare component/html into variable? let test = 'something like <Component /> but acceptable by variable' let lala = test; </script> <Description {test} /> Description.svelte <script> export const lala </script> {#if something} {@lala html} {:else if something } nope {/if}Creo que esta preguntaRendering Svelte components from HTML string tiene una especie de respuesta, pero no pude hacerla funcional.
No estoy seguro de lo que quiere decir con "texto de HTML a cadena", pero si desea pasar un componente a un componente secundario, puede pasarlo como accesorio:
<!-- App.svelte --> <script> import Component from './Component.svelte'; import Description from './Description.svelte'; </script> <Description component={Component} /> Para mostrar un componente que está definido en una variable, puede usar el elemento especial <svelte:component> .
<!-- Description.svelte --> <script> export let component; </script> {#if component} <svelte:component this={component}></svelte:component> {:else} component isn't set {/if}Aquí hay un enlace Svelte REPL que funciona .
Si desea obtener más información sobre el elemento especial <svelte:component> , consulte el tutorial .