
当你想在 svelte 中获取某些内容时,推荐的方法是将其放入 load 函数中。
我写了一篇关于异步获取的文章以及为什么这对于加载函数之外的工作很重要。
一般来说,当不涉及ssr时,您可以更好地控制竞争条件、错误处理和加载函数之外的实现。虽然我同意在大多数情况下您应该使用加载函数(使用 sveltekit),但并非所有情况都如此。
这是一个简单的资源函数来处理这个问题:
// resource.svelte.tsexport let resource = ( fn: () => promise, initialvalue?: t) => { const _rune = $state({ value: initialvalue }); $effect(() => { fn().then((data) => { _rune.value = data; }); }); return _rune;};
您可以在组件中像这样使用它:
import { resource } from '$lib/resource.svelte';...const todo = resource(() => fetch(`https://jsonplaceholder.typicode.com/todos/${id}`) .then((response) => response.json()));
并用以下方式显示值:
{todo.value}
其他框架中的类似概念
反应查询vue 手表solidjs createresourceqwik useresource$angular 19 资源ngxtension衍生异步
现在您可以轻松地从异步资源创建信号!我希望有一天像 $resource 这样的东西可以在 svelte 中实现。
演示: vercel
仓库: github
j
以上就是Svelte 5 中的异步获取的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1498057.html
微信扫一扫
支付宝扫一扫