iOS 开关状态不持久的 React Native AsyncStorage

Question

我试图通过使用 AsyncStorage 存储布尔值来保持开关按钮状态，但它不起作用。每当我离开该屏幕或关闭应用程序并 return 进入该屏幕时，开关状态将重置为默认值，而不是从 AsyncStorage 值读取。

这是我定义的 AsyncFunctions：

export async function setPersistedSwitchState(newValue) {
    await AsyncStorage.setItem(
        'switchState',
        JSON.stringify(newValue),
    );
}

export async function getPersistedSwitchState() {
    const switchState = JSON.parse(
        await AsyncStorage.getItem('switchState'),
    );
    return switchState;
}

这是我在切换开关屏幕上的代码：

export function switchButtonScreen() {
    let currentState = false;
    const [toggleState, setToggleState] = useState(
        currentState
    );

    useEffect(() => {
        const getSwitchState = async () => {
          try {
            const value = await getPersistedSwitchState()
            return value != null ? value : false;
          } catch(e) {
            console.log(e);
          }
        };
        currentState = fetchPersistedSwitchState();
    }, [toggleState]);


    const toggleSwitch = async () => {
        setToggleState(!toggleState);
        if (!toggleState) {
            await setPersistedSwitchState(true);
        } else await setPersistedSwitchState(false);
    };

    return (

                    <SwitchButton
                        enabled={toggleState}
                        onChange={toggleSwitch}
                    />

    );
}

...

如有任何帮助，我们将不胜感激。提前谢谢你。

Answer 1

正如@emkarachchi 在评论中指出的那样，您需要在 useEffect 通话结束时联系我们 setToggleState(currentState)。状态仅在首次加载屏幕时使用 currentState。

对于 setPersistedSwitchState 最好直接使用你的 togglestate 变量，这样你就不需要 ifs，所以 setPersistedSwitchState(!toggleState).

iOS 开关状态不持久的 React Native AsyncStorage

React Native AsyncStorage for iOS switch state not persisting

reactjs

react-native

use-effect

asyncstorage

persistent-storage