javascript - 检测何时不再使用 svelte store

Question

我正在通过包装一个精巧的可写存储来制作一个自定义的精巧存储。

我想检测该商店何时未被任何组件订阅；当订阅数为0时

我的目标是清除一些在没有人使用时绑定(bind)到自定义商店的大量外部资源(websockets)。

目前，我通过封装 subscribe( ) 方法来计算订阅和取消订阅。 它按预期工作。但对我来说，这看起来像是一个讨厌的 hack。

我的问题:在 Svelte 中是否有一种标准/干净的方法来实现这种行为？

如果不是，有更多 Javascipt 和 svelte 经验的人可以确认这是否合法吗？

演示:https://svelte.dev/repl/f4e24fb5c56f457a94bf9cf645955b9f?version=3.43.1

import { writable } from 'svelte/store';

// Instanciate the store
export let store = MakeStore();

// By design, I want a function that returns a custom svelte store
export function MakeStore(initialValue = null) {

        const { subscribe, set, update } = writable(initialValue);

        let subscribercount = 0;

        let wsubscribe = function (run, callback) {
            subscribercount++;
            console.log("subscribercount++", subscribercount);

            let wunsubscribe = subscribe(run, callback);
            return () => {
                subscribercount--;
                console.log("subscribercount--", subscribercount);

                if (subscribercount == 0) {

                    // -------------------------------
                    // Free up resources
                    // I want a clean way to get here
                    // -------------------------------
                    console.log("Cleaning up...");
                }
                return wunsubscribe();
            }
        }

        // Some external calls here

        let store = {
            subscribe: wsubscribe,
            set: newvalue => {
                set(newvalue);
                // Some external calls here
            },
            update: update
        };

        // Some external calls here

        return store;
    }

Answer 1

是的，它内置于商店中并记录在案here

来自文档

If a function is passed as the second argument, it will be called when the number of subscribers goes from zero to one (but not from one to two, etc). That function will be passed a set function which changes the value of the store. It must return a stop function that is called when the subscriber count goes from one to zero.

所以你会这样做，例如:

const count = writable(0, () => {
    console.log('got a subscriber');
    return () => console.log('no more subscribers');
});

2023 年 2 月 8 日更新

请注意，以上内容适用于可读 和可写 存储，对于派生 存储，您将拥有以下代码:

const count = derived(items, ($items, set) => {
  console.log('got a subscriber to a derived store');
  return () => console.log('no more subscribers to derived store');
});

当订阅者数量下降到 0 或原始商店发生变化时(这是因为整个函数($items, set) => {...} 再次运行)。

从 v3.55.1 开始，没有内置的方法来规避这一点。