kit: (re)trigger the load function
Is your feature request related to a problem? Please describe.
The new invalidate(href) feature in $app/navigation is a great way to trigger the execution of a load function that works in most cases. The problem is that this only works if one uses the fetch function that is provided as an argument to load. If a apiClientWrapper is used this does not work anymore.
Describe the solution you’d like
One solution would be to pass a invalidate or update function to the load so that I can be passed as a prop or via context.
This solution would update a specific load function instead of a specific fetch url.
<script context="module">
import { api } from '$lib/myapi';
export async function load({page, update}){
const item = await api.getItem(page.params.id);
return {
props: { item, update }
}
}
</script>
<script>
import Item from '$lib/Item.svelte';
export let item;
export let update;
</script>
<Item {item} />
<button on:click={update}>Reload</button>
Describe alternatives you’ve considered A alternative would be to write a second function in the (non module) script tags that replicates the load function to update data.
How important is this feature to you? Somewhat important. It would make the code cleaner and more reusable but there are easy workarounds.
About this issue
- Original URL
- State: closed
- Created 3 years ago
- Reactions: 8
- Comments: 16 (5 by maintainers)
Commits related to this issue
- Merge branch 'master' of github.com:icalvin102/kit into gh-1684 — committed to icalvin102/kit by icalvin102 3 years ago
- Merge branch 'master' of github.com:icalvin102/kit into gh-1684 — committed to icalvin102/kit by icalvin102 3 years ago
- Merge branch 'gh-1684' into svelte-kitlike-router — committed to icalvin102/kit by icalvin102 3 years ago
- Merge branch 'master' into gh-1684 — committed to icalvin102/kit by icalvin102 3 years ago
- Merge branch 'sveltejs:master' into gh-1684 — committed to icalvin102/kit by icalvin102 3 years ago
- Merge branch 'master' into gh-1684 — committed to icalvin102/kit by icalvin102 3 years ago
- merge master -> gh-1684 — committed to icalvin102/kit by Rich-Harris 2 years ago
@etienneburdet
goto()will only runload()ifpage.params,page.path,page.query,sessionorcontextis used inside ofloadand one of those values has changed since the last run of the load function. This is the desired behavior ofgotoor any form of navigation as this prevents unnecessary loading of (sub)routes.What I want is function that is similar to
invalidatebut it should be bound to aloadfunction instead of invalidating a URI.The use case is similar to the one described in #1277 but with a more general solution.
Perhaps something like?
There are still many different use cases when you want invalidate page data only or invalidate both page and layout altogether. Anyway, the
invalidatefunction seems to be no good when you use customfetch()lib.Something like this is needed because not all data retrieval is from different endpoints. Sometimes it the same endpoint and the msg describes the data that you want.
I came here because invalidate was not working and I worked out it was because I had a URL query string. When I invalidated the main endpoint if I did not put in the query string exactly it would no-op. This might not be a bug but it was surprising.
goto()on the current location shall do the trick, no? Since components won’t remount and state variables will be kept, what you have left is basically a run of theloadfunction. Or does only work with dynamic routes 🤔 ?