Svelte Derived Store原子/去反弹更新

问题描述

我一直在尝试一些苗条的商店。如果在以下示例中查看控制台日志，则在增加存储1和存储2之后，单击reset，派生的存储将发出2个更新。

您将如何使其原子化或去抖动？例如，假设这种情况是，派生商店基于商店1和2的组合值发出了一个新的网络请求，如果它们一起更改，那么您将不会触发2个网络请求？

https://svelte.dev/repl/a67c9d37aee348d988e8c30f60a139d9?version=3.28.0

编辑：实际上，只是添加了一个“反应性”控制台日志，这似乎对输出进行了反跳（勾选）。

我想我已经回答了自己的问题？

解决方法

派生商店的回调第二个参数为mSshClient = SshClient.setUpDefaultClient(); mSshClient.start(); mConnectFuture = mSshClient.connect(mUsername,mServerAddress.getHostAddress(),mServerPort,null); mClientSession = mConnectFuture.verify().getSession(); mSftpClient = new DefaultSftpClient(mClientSession); ，它允许异步设置派生值。

set

API reference for derived()

---

对于您的情况，您可以调用一个反跳函数，该函数最终将调用import { derived } from 'svelte/store'; const delayed = derived(a,($a,set) => { setTimeout(() => set($a),1000); }); $: console.log($delayed); $a = 1; // console '1' 1 second later. ：

set

Svelte REPL

,

加上@TanLiHau 的回答，您也可以在没有“全局”/外部作用域变量 timeoutId 的情况下执行此操作。

Svelte 的 derived 允许返回用于清理的回调 (https://svelte.dev/docs#derived)：

如果您从回调中返回一个函数，它将在 a) 回调再次运行或 b) 最后一个订阅者取消订阅时被调用。

这允许你写成如下：

const total = derived([counter1,counter2],([c1,c2],set) => {
    const timeoutId = setTimeout(() => {
        console.log(c1,c2);
        return set(c1+c2);
    },1000);
    
    return () => clearTimeout(timeoutId)
},0);