pablo-abc / svelte-markdown

Markdown parser to svelte components
MIT License
359 stars 50 forks source link

Using SvelteMarkdown inside a loop #6

Closed yakou32 closed 3 years ago

yakou32 commented 3 years ago

I'm quite new to Svelte, so I'm not so sure this is indeed a svelte-markdown issue...

I'd like to process markdown within a loop, but it looks like <SvelteMarkdown {source} /> does not accept a dot syntax for the source.

Beyond the linting error in VS code, this prevents code from compiling... image

pablo-abc commented 3 years ago

Hey! Nothing to do with this package. The syntax you're trying to use is only meant to be used when the variable you're trying to pass as a prop has the same name as the prop itself.

SvelteMarkdown expects your markdown to be passed down with a prop called source, so what you want to do is something like:

  <SvelteMarkdown source={skill.label} />

You can read more about attributes and props in the official Svelte docs.

If you really want to use this syntax then you would need to destructure each skill and alias label to source. For example like this:

{#each skills as { label: source }}
  <SvelteMarkdown {source} />
{/each}

I'll go ahead and close this since this is not related with this package.