SolidJS setStore 未仅修改指定路径，而是作用于所有属性

尝试在SolidJS的store中为指定Action对象设置回调引用时，发现回调并未仅作用于目标对象，而是被应用到了store中所有路径相似的Action对象上。

相关代码 #

注册回调的函数：

const registerActionCallback = (
    on: 'Use' | 'Combo',
    actionName: string,
    cbKey: string,
    cb: (fns: ControllerActionFns) => void
) => {
    setState(
        'actionPool', // Record<string, Action>
        actionName, // string
        `on${on}Callbacks`, // Record<string, fn>, property of Action object
        cbKey,
        (_: (fns: ControllerActionFns) => void) => cb
    );
};

示例状态定义：

const [state, setState] = createStore({
    actionPool: {
        A: {...},
        ...,
        M: {
            ...,
            onUseCallbacks: {} // initially empty
            onComboCallbacks: {} // initially empty
            ...,
        },
        ...,
        Z: {...},
    },
    ...,
});

需求与问题现象 #

需求是：作为按钮的各个Action被点击时，执行自身onUseCallbacks或onComboCallbacks中存储的回调（用对象存储是为了方便注销）。

比如为Action M的Use事件注册名为'testCB'的回调，调用代码如下：

setState('actionPool', 'M', 'onUseCallbacks', 'testCB', () => () => console.log('hello'))

预期只有点击Action M对应的按钮时打印'hello'，但实际点击actionPool中A到Z的任意按钮都会触发该打印。此前多次以类似方式使用SolidJS store从未遇到问题，这是首次尝试存储回调。

回调调用方式 #

将被点击的Action引用传入fireAction函数，执行以下逻辑：

for (const key in action.onUseCallbacks) 
    action.onUseCallbacks[key]();

修复方案 #

问题与SolidJS无关，是生成Action对象的原型实现存在漏洞——所有Action对象的onUseCallbacks和onComboCallbacks都引用了同一个对象。重写原型实现后，功能恢复正常。

内容的提问来源于stack exchange，提问作者George Maharishi