【问题标题】:Detect when svelte store is not used anymore检测何时不再使用 svelte store
【发布时间】:2021-12-01 05:30:10
【问题描述】:

我正在通过包裹一个可写的苗条商店来制作一个自定义苗条商店。

我想检测该商店何时没有被任何组件订阅;当订阅数为0时

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

目前,我通过包裹 subscribe() 方法来计算订阅和取消订阅。 它按预期工作。但这对我来说似乎是一个讨厌的黑客攻击。

我的问题:在 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;
    }


【问题讨论】:

    标签: javascript javascript-objects svelte svelte-component svelte-store


    【解决方案1】:

    是的,它内置在商店中并记录在 here

    来自文档

    如果一个函数作为第二个参数传递,它将在订阅者数量从零变为一(但不是从一到二等)时调用。该函数将传递一个 set 函数,该函数会更改 store 的值。它必须返回一个停止函数,当订阅者计数从 1 变为零时调用该函数。

    例如,你会这样做:

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

    【讨论】:

    猜你喜欢
    • 2020-07-13
    • 2020-12-05
    • 2021-06-26
    • 2010-09-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多