Go Pro Sign Up Login
0 days 0 hrs 0 min 0 sec

Summer Sale

50% off Level Up Pro until you unsubscribe.
Get access to ALL 128 courses on Level Up Tutorials

This is your last chance to get Level Up Pro for $145/year.

or Learn More
Moon Moon

Buy Now and unlock this series

$

49

.99

yours forever

Become a Pro and unlock everything

$

24

.99

per month

Loading in Depth

Here we will take an in-depth look at the loading page. We will learn how to take care of redirects and display error messages when a page is not found or does not load as expected.

Downloads

Become a pro to download code and videos

Comments

User avatar

Michael

7 months ago

This code works (assume api endpoint is correct,note: 'mybrand' is made up. in vanilla Svelte , but not in sveltekit. Is it because I need to set up the api.js function? Does Scott have an example of this working?

Unsplash Search App

    {#each searchResults as result}
    {result.image} {/each}

Jishnu

9 months ago

Does anyone have an issue with the dynamic href working?

       {#each posts as post}
            <li><a href={post.slug}>{post.title}</a></li>
        {/each}

so if the post.slug is hello it is taking to http://localhost:5000/hello instead of http://localhost:5000/posts/hello

Any idea how to fix it?

Zak

3 months ago [edited]

for anyone looking for the answer to this question..

    {#each posts as post}
        <li><a href="/posts/{post.slug}">{post.title}</a></li>
    {/each}

Jishnu

9 months ago [edited]

Jishnu

9 months ago [edited]

Bill

10 months ago

I added the interpolation in __layout.svelte to link to /post/${post.slug}. I noticed the URL was changing in the browser but the page contents were not changing. So, for example, from /posts/hello I would click on goodbye. The browser thinks it's on goodbye, but the contents of hello were still displayed.

Not sure what to, I built the project. That, helpfully, pointed out:

<Post/> will not be reactive if Post changes. Use <svelte:component this={Post}/> if you want this reactivity.

Doing that made everything work correctly.

Amy

12 months ago [edited]

@Jon OR anyone... any idea why it would work in dev but not live?

Mike

about 1 year ago

But why though, is there some missing reactivity concept one hasn't unlocked by this point?

User avatar

Spenser

about 1 year ago

@Lee thanks bucko. I was complaining about this on the last lesson. Saved me a lot of Googling.

User avatar

Lee

about 1 year ago [edited]

@Jon Your suggesting of altering [slug].svelte and replacing <Post /> with <svelte:component this={Post} /> worked for me too. At least on dev server, haven't tried deploying yet.

Mike

2 months ago

Lee, this was incredibly helpful. Thanks

Jon

about 1 year ago [edited]

@Raul SOLVED: Had I been looking at my terminal I would have seen this before. I changed the component call to <svelte:component this={Post}/> and everything is working as expected now. 🙌 .....

🤦‍♂️ except when it's pushed and deployed. Works on dev server - not live. Lol. But it hella fun figuring it out. 😄

Jon

about 1 year ago

@Raul Thanks I’ll double check again. Although the issue was occurring in the video as well - but I’ll try downloading and running / comparing there. Cheers 😀

User avatar

Raul

about 1 year ago

@Jon I'd check if the path you are being redirected from /posts/postName is correct, if its not check your layout file as its probably an issue with the value you are passing as href. You can also download the code for this episode and compare with your code to see where the problem is 🙂

Jon

about 1 year ago [edited]

I am struggling with the last 15 seconds of the video. After correcting the layout file to include /posts - although the url changed the post did not. Clicking on the goodbye post loaded it - but from within the goodbye post clicking the hello post changed the url but the post did not load. I'm struggling to understand why that it happening. (It is in my code as well) UPDATE: I added a "posts" link in the Header and if I am in a post and click to go back to /posts - and then select another blog post it loads but only from the /posts not from the /posts/postName.

Want to join the conversation?

Become a Pro member today!