苗条的商店分配调用默认的writable（）。set，然后自定义.set？

Question

Relevant REPL

我有一个带有自定义set方法的简单可写商店：

import { writable } from 'svelte/store';
function createState() {
    const {subscribe, set, update} = writable({a: 0, b: 0});
    return {
        subscribe,
        set: (newState) => {
            console.log(newState);
            // set(newState); // I would expect `state` to be unchanged without this
        }
    };
};

export const state = createState();

当我调用state.set(<some new value>)时，新值将记录到控制台，而state的值实际上并没有改变。这就是我的期望。
但是，如果我分配了$state = <some new value>，则state的值会更改，然后 then set会将其记录到控制台。为什么（以及如何）发生这种情况，并且有办法解决而不重新实现writable？

谢谢！

Answer 1

这是预期的行为！暂时忘掉商店，并且-因为state.set在您的示例中是个小问题-删除该行：

<script>
    // import { state } from "./stores.js";

    let pojo = { a: 0, b: 0 };
    pojo.a = 1;
    pojo = {d: 0};

    //state.set({c: 0}); // no effect, as expected
</script>

<h1>state: {JSON.stringify(pojo)}</h1> 

结果...

state: {"d":0}

...正是您所期望的。

当我们将pojo替换为$state时，我们仍将分配（或变异）具有相同反应性特征的局部变量。唯一的区别是我们也正在调用state.set。通常，这将导致商店价值发生变化，并反映给其订户，但是由于您的自定义商店没有这样做，因此剩下的是上次$state被分配触及之后的价值运算符。

Answer 2

在REPL的JS输出中，您可以看到以下内容：

function instance($$self, $$props, $$invalidate) {
    let $state;
    component_subscribe($$self, state, $$value => $$invalidate(0, $state = $$value));
    set_store_value(state, $state.a = 1, $state); // changes the value of state?!
    set_store_value(state, $state = { d: 0 }); // ''
    state.set({ c: 0 }); // no effect, as expected
    return [$state];
}

使用简写的反应式分配$<store>可以编译成set_store_value()调用，这是thusly定义的一种精巧的内部方法：

export function set_store_value(store, ret, value = ret) {
    store.set(value);
    return ret;
}

因此，分配的值实际上将按照您的期望传递给商店的set函数。

但是，您可以在上面的JS输出中看到，最终返回的值是名为$state（$符号的 local 变量没有不是反应式修饰符，只是名称的一部分）。在这些set_store_value()调用期间，您可以看到此局部变量被分配了与传递给商店的set方法相同的值（实际上，该局部变量被分配了该值，然后是其自身传递给set_store_value()方法）：

set_store_value(state, $state.a = 1, $state); // changes the value of state?!
set_store_value(state, $state = { d: 0 }); // ''

我希望这种行为是某种乐观的前瞻性/解决方案。

在Svelte store contract中暗示，传递给商店的set方法的值必须实际上必须相应地修改商店，在这种情况下，乐观解决方法将总是产生连贯的结果？

希望里奇·哈里斯（或其他斯维尔特撰稿人）看到您的问题并提供更明确的答案。

Answer 3

扩展Thomas Hennes的出色分析：

set_store_value(state, $state.a = 1, $state);

此内部调用无需使用$state.a = 1或set方法即可更新内部商店模型（update）。对我来说，这有点出乎意料，而且可能是一个很严重的错误。至少，当我们设计复杂的定制商店并希望使用商店的简写时，需要牢记这一点。