回调中丢失范围，如何有效地使用绑定

Question

在我的例子中，compareValue 中的 localesCollection 有一个旧的（未更新的）值。状态不是实时的。我以为 bind 是来拯救我的一天的。

// Redux
let localesCollectionValues = useSelector((state: IStore) => state.localesStoreSlice.localesCollectionValues);

const compareValue = (fieldValue: any): void => {
    console.log('compareValue', fieldValue, localesCollectionValues);
}

const attachListeners = () => {
    console.log('attachListeners');
    Object.keys(sdk.entry.fields).forEach((field: string) => {
        const fieldRef: any = sdk.entry.fields[field];
        fieldRef.locales.forEach((localeKey: string) => {     
            fieldRef.getForLocale(localeKey).onValueChanged(compareValue.bind(this));
        });
    });
};

编辑：是来自直接在回调中使用箭头函数，问题与上述相同

编辑2： 'localesCollectionValues' 的值是代码初始化和处理程序设置时的值。之后它没有更新，它只保留 n 个旧参考。典型的内存指针/范围问题，需要一个方向来解决这个问题。

fieldRef.getForLocale(localeKey).onValueChanged(() => {
   console.log(localesCollectionValues) // <- not real time, 
   // contains old value
});

Answer 1

事后看来，我只需要遵循 React Hooks 的状态管理说明，非常有道理：

const [changedLocale, setChangedLocale] = useState('');

useEffect(() => {
    console.log('changedLocale', changedLocale, localesCollection);
    // accurate, real-time
}, [changedLocale, localesCollection]);

const attachListeners = () => {
    Object.keys(sdk.entry.fields).forEach((field: string) => {
        sdk.entry.fields[field].locales.forEach((localeKey: string) => {
            const fieldRef: any = sdk.entry.fields[field];
            fieldRef.getForLocale(localeKey).onValueChanged(() => {
                setChangedLocale(localeKey);
            });
        });
    });
};

回调中丢失范围，如何有效地使用绑定

lost scope in callback, how to use bind effectively

scope

bind

callback