svelte - 订阅时不应调用 Svelte 商店订阅功能

Question

我不明白这一点。我正在尝试订阅一个苗条的商店。但是传递给subscribe的闭包函数会立即被调用。即使商店的价值没有改变。

这是一个苗条的 REPL示例

使用以下代码：

<script>
    import { onDestroy } from 'svelte';
    import { writable } from 'svelte/store';
    
    const store = writable({ givenName: '', familyName: '' });
    
    const unsubscribe = store.subscribe( state => {
    console.log('This function shouldn\'t have been invoked on subscription.');
    });
    onDestroy(unsubscribe);
</script>

<h1>
    Please check the console output ...
</h1>

恕我直言，应该在更改而不是在订阅时触发关闭函数，或者我缺少什么？

Answer 1

商店将writable立即调用subscribe以其当前值传递给的函数。这是“按设计工作”。如果您只关心更新，则需要自己编写一个小包装器来忽略第一个值。

例如一个函数

    function subscribeIgnoreFirst(store, fn) {
        let firedFirst = false;
        return store.subscribe(state => {
            if (!firedFirst) {
                firedFirst = true;
            } else {
                fn(state);
            }
        })
    }

Answer 2

其他一些观察。

1. javasript 函数总是返回一个值。即使您不返回值，该函数也会返回未定义。

2. 当您订阅时，商店总是返回“当前值”。因此，当您订阅时，商店总是会返回一个值。或者，如果您是第一个订阅者，您是否愿意等待下一次更改。或者，如果您错过了第一个，请永远等待。也许下一次改变永远不会到来。

3. 当然，跳过初始值很容易。或者一个特殊的初始值。