It's a single line of code, I tried a lot of approaches, but I just can't get the result I want.
What do I want?
I want to set the attribute loading = lazy
starting at the second item in the array. I tried a lot of things, my last temptation was to use the post ID. But does not work. Look at else if
.
<script>
// post props
export let post;
</script>
<!--HTML here-->
<div>
<!-- display posts images -->
{#if post.image}
<!--check if image is not empty -->
<img src={post.image.formats.medium.url} alt={post.title} />
<!-- if id is greater than 2 add loading="lazy" -->
{:else if post.id > 2}
<!-- set lazy images -->
<img src={post.image.formats.medium.url} alt={post.title} loading="lazy" />
{:else}
<!-- if no images then placeholder -->
<img src="images/900x600.png" alt={post.title} loading="lazy" />
{/if}